I’ve been trying to enable this for the better part of the last few hours…
I enabled the source maps in the project settings in CodeKit.
However, no CSS source map is being generated. I’ve checked the Chrome settings, the source maps option is enabled, as well as the individual switches for CSS and JS under Sources, but it still doesn’t work.
Does anybody know how to activate this?
Thanks.
Source maps aren't currently supported for Compass projects, but will be soon. I'm waiting on the actual release of Compass 1.0.0 (we're still on a pre-release version)
I'm researching the same problem. When I make a dummy set of files new on my desktop, Sourcemaps work fine. When I pull a repository from stash/github it will not generate source maps. So I believe it's a folder permissions error
Related
I'm looking to install Webpack4 for a project.
Part of what I want it to do is lint css.
Just about every resource I find points to "stylelint-webpack-plugin" (https://github.com/JaKXz/stylelint-webpack-plugin).
That project's not been getting updated for a long time.
From what I can tell the webpack team bullied the dev responsibile for lots of the work on stylelint-webpack-plugin right out of the community.
So now the project's got nobody doing the work and it's "looking for a maintainer". After that whole mess, doesn't look like anyone's signing up.
From my perspective -- Oh Well! Next !?
Is there a different alternative to stylelint-webpack-plugin for lint-ing styles in a webpack setup?
The stylelint-webpack-plugin now belongs to the official webpack-contrib GitHub organisation. The plugin's dependencies are up-to-date and it supports the latest version of stylelint (version 9).
I believe it is the still the most appropriate plugin for using stylelint within Webpack.
I've been facing a really frustrating problem regarding .graphql files while developing in Meteor. Whenever I change my graphql files, Meteor does not notice the changes and I should change something in the source files to force Meteor to reload.
However, sometimes it does not even apply the changes after the hot reloading.
I'm wondering if the be any solution to get around this issue.
Meteor knows to recompile based on files changing that have an extension that Meteor or a Meteor build plugin supports.
https://guide.meteor.com/build-tool.html#build-plugins
This one supports .graphql files:
https://github.com/Swydo/meteor-graphql
I have an application that was created from create_react_app then ejected, with no modifications.
Everything works as expected when running the dev version.
Unfortunately when I do npm run build and run this via serve -s build my styles are not working.
The .css files are being found and compiled into a single minified version. But the problem is that the markup that is generated is having the class name prefixes changed to 'T-' instead of the prefix in the compiled .css file. (i.e) MyApp-header is getting changed to T-header, but in the minified css file, it still refers to MyApp-header.
prefix changed to T-
Any help would be appreciated.
This issue turned out to be caused by some nuance of using this...
#SuitCssify.decorator
I was evaluating this library for potential use in a project, and didn't discover this issue until trying to produce an actual production build.
I've since abandoned this approach and changed my configuration to use "CSS Modules" which are working out great. I would provide a link, but my reputation only allows me one link per post. ;(
my 'webpack.config.[dev & prod].js' changes to enable css modules
I am running Debian Wheezy. I am playing with gulp last few days. My problem is that when I point browser to file directly (file:///...) source maps linked correctly like this:
But when I point with localhost/... I get this:
On Iceweasel everything works perfectly. I triple checked all settings, so that part is OK. I thought it might be some security issue, so I chmod recursively project root, but that is not the issue.
This is my folder structure:
This is my gulpfile.js:
I got scss files that look like this:
index.scss
_test.scss
When I run gulp command on root folder I get:
index.css
Can it be some Chromium issue? I tried doing almost everything I could think of. The fact that it's working on Iceweasel makes me think it's specific Chromium problem, but it's so hard to give up. :D
I had experienced the similar issue, especially with BrowserSync.
Version Info:
OS X El Capitan#10.11.12
Google Chrome#47.0.2526.80 (64-bit)
browser-sync#2.9.0
Description
Chrome could not autoload Scss sourcemaps watched by BrowserSync, while Chrome private mode, Chrome Canary, Safari works with Scss sourcemaps correctly whether using BrowserSync or python simple HTTP server command line.
The solution may be specific to my case. I tried Google Web Starter Kit(#0.6.0)'s Service-Worker previously, so I went to chrome://serviceworker-internals and unregistered items listed in that page.
It's done. Soucemaps work as expected again.
Try adding your local folder in chrome workspace. Here is a perfect tutorial on enabling and using workspaces:
http://www.sitepoint.com/using-source-maps-debug-sass-chrome/
Hope it helps.
I have recently upgraded to VS2012 and have a small issue. All our sass files are checked into source control and the corresponding css file gets generated when the project is built (the css file is never part of source control). with VS2012, as soon as i edit the sass file, a css file is created under the sass file (nested under it) and the project file is checked out. I do not want this as we don't need to check in the css file.
Is there an option i can set to avoid this ? Had a quick look under tools ->options but didnt see anything
The only plugin we have installed is Mindscape Web Workbench free version.
Thank you for any advice.
So the Web Workbench plugin was automatically modifying the project file and including the following under my scss files. This was still present even when i disabled and removed the plugin. There's no option to disable this function in Web Workbench, so i wont be using it anymore.
<Compile>True</Compile>
<Minify>True</Minify>
<CompileStyle>Nested</CompileStyle>
<DebugInfo>False</DebugInfo>
Using SassyStudio now which is nice and simple.Has the option to disable auto css creation and project adding etc.
Hope this explanation can help someone else.