This other question ultimately led me to the right answer. It looks like the LESS compiler is silently failing if files are encoded with a BOM. (That’s a Byte Order Mark for those not familiar with the term.) This is the default setting in some editors, such as Visual Studio. The compiler barfs up an … Read more
To get LESS syntax highlighting, you have to download and import a user defined language file. Here are some links to language files: LESS language file, as listed in the Notepad++ User Defined Language List LESS language file on GitHub Installation instructions from the GitHub repository: Download the less.xml file Open Notepad++ Go to Language … Read more
I’ve written a quick blog post about Using LESS CSS With MVC4 Web Optimization. It basically boils down to using the BundleTransformer.Less Nuget Package and changing up your BundleConfig.cs. Tested with bootstrap. EDIT: Should mention the reason I say this, is I also ran into the @import directory structure issue, and this library handles it … Read more
You actually need to use <style type=”text/less”> instead of: <style type=”stylesheet/less”> Otherwise it won’t work. Remember to place the <style> element before the <script> element to load less.js.
The way to do this is what bootstrap does – have a file which imports all the others and compile that. @import “variables.less”; @import “mixins.less”;
See Loops. For example (assuming @green, @red, @blue variables are defined elsewhere): @colors: green, red, blue; .example_module { .-(@i: length(@colors)) when (@i > 0) { @name: extract(@colors, @i); &.@{name} {background: @@name} .-((@i – 1)); } .-; } – – – In Modern Less the same can be more straight-forward with the help of the Lists … Read more
in your src set the base option and it will maintain the original path of your less file. gulp.task(‘compileLess’, function () { gulp.src(‘./*/less/*.less’, {base: ‘./’}) .pipe(less()) .pipe(gulp.dest( ‘./dist’ )); }); The ./dist destination can be anything. Wherever you want your file structure to be placed. Additional info here: https://github.com/wearefractal/glob-stream#options
From the link you provided : Less.js browser script currently won’t work if you’re using Chrome and the path to your page starts with “file:///” due to a known Chrome issue.
Chrome Developer Tools now supports Sass debugging out-of-the-box. Updated to include source maps: Previous versions used inline comment in your css to provide a refernce to the source code (see below how-to). recent versions of sass (3.3+) and chrome (31+) use source maps for that: Make sure you have Sass 3.3.x Compile your Sass with … Read more
Try using string interpolation for things like this. Look for “variable interpolation” in docs. @base-url: “http://assets.fnord.com”; background-image: url(“@{base-url}/images/bg.png”);