I have a LESS file which I want to compile to use as my bootstrap theme. How can I compile it? Is there a place where I can do this?
The less FILE comes from http://bootswatchr.com/ but when I click the link get CSS and choose either minified version or complete version, nothing happens.
I have the LES file from the left pane, is there a way I can still compile it?
Install node.js
Install the Less compiler: npm install -g less
Run the Less compiler on your Less source to produce CSS: lessc your-source.less > output.css More info: http://lesscss.org/#using-less
If you are using WebStrom IDE, then it has a plugin for LESS to compile. I have been using the plugin to compile the LESS over a year.
If you want software, then I would recommend SimpLESS. You can use it on OSX/Win. It has drag and drop support which is nice and will tell you if your syntax is wrong. It also updates to support the latest LESS version.
Related
Our team is starting to use LESS to write CSS. I am using atom.io and there is a plugin to auto-compile LESS to CSS on save. (Link to plugin) However, some team member prefer to use sublime. While there are also similar plugin for sublime, it requires npm for installation. Our team mainly use PHP with composer for package management, so installing npm just for a plugin seems a bit overkill. Is there any other way to do LESS auto-compile on save with sublime?
Not that I know... :(
There is a python library that compiles less to css. (sublime plugin are written in python) though
So, all you've got to do is: write this plugin using lesspy
If you are a bit patient, I am trying to make this plugin, it shouldn't be to hard, I'll keep you in touch.
Matt
EDIT: Here's the plugin: st-py-less. Follow the (simple) instructions to install it. Only working with Sublime Text 3.
They could probably use SublimeOnSaveBuild
But npm and Composer aren't really comparable here. Composer manages a project's dependencies, npm provides easy access to hundreds of thousands of community-maintained packages. Using Composer isn't a reason to not install npm.
And the package you install when you "install npm" is under 14MB. It also comes included with Node.js. The "Installation Requirements" for sublime-less2css, by listing "install node" and "install npm" as two separate steps are misleading, and the provided links aren't that helpful. Here's the official documentation for Installing Node.js and updating npm
This is getting beyond the scope of your question, but to have a single team-wide editor-agnostic setup for automatically compiling LESS to CSS you could use Gulp. If you aren't familiar with Gulp, follow CSS-Tricks' Gulp for Beginners from the start up through the "Watching Sass files for changes" step. (Note that the guide teaches you how to use gulp-sass to compile Sass to CSS; in your case you'd just use gulp-less instead.)
I have installed WebStorm 9 on Mac. I am having problems getting my LESS code compiled to CSS even after installing the LESS Compiler plugin.
The following message gets displayed:
"Missing CSS Output Directory - You can add CSS output directories under Settings > Project Settings > LESS Compiler"
Though there is no "Project Settings", I have add out put directory to LESS Compiler in "Settings".
It still does not work.
Known issue - see https://github.com/acdvorak/intellij-lessc-plugin/issues/47.
I can suggest using less compiler (npm install -g less) configured as a file watcher instread - see https://www.jetbrains.com/webstorm/help/transpiling-sass-less-and-scss-to-css.html
I also meet the problem in mac WebStorm, finally found where is wrong:
WebStorm Less compiler only work for ver. less 1.6.2
please use below under your project:
sudo npm install less#1.6.2
then in File Watchers in WebStorm to edit Less watcher,
in Program field change path to:
yourProjectPath/node_modules/less/bin/lessc
then happy css will appear. :)
I currently compile LESS with lessc (version 1.7.0) fine, but when I add --source-map, I get
SyntaxError: Cannot find module 'source-map' in /home/me/my.css
I suspect this may be because I did not install LESS using npm. How can I get source maps working?
The requirement (sorry): This must be able to be versioned entirely in a VCS, and not use npm for setup.
If you're not downloading the whole package at least make sure you have the libraries LESS needs. Checking their repo you can see source-maps is listed there so you might need those files too.
Here's the link: https://github.com/less/less.js/tree/9d3ef59cf818691cd52410879e7152e7d589de32/lib
Hope it helps.
I decided to use the Sass version of Foundation 4.
I followed the instructions from the official Foundation 4 documentation:
For a new installation i started with following code in my console:
sudo run compass create <project-name> -r zurb-foundation --using foundation
To compile my SCSS Files to CSS i ran:
compass watch
After that everything works fine and i'm ready to start editing my files.
Now my problem:
Every time when i make changes in my SCSS files, it would take almost 8 seconds to compile the CSS-file. Status in console:
Change detected at 09:52:48 to: app.scss
displays very fast, but after that
overwrite css/app.css
is to slow.
What am I doing wrong?
Versions:
Sass 3.2.12 (Media Mark)
Compass 0.12.2 (Alnilam)
You'll find my SASS-file structure here:
Github SASS-file structure
You're not doing anything wrong. Compass (built on Ruby) is notoriously slow in compiling SASS/SCSS. Especially larger, more complex structures like Foundation. 8-10 seconds is about average for my Foundation projects, too. It doesn't even seem to matter whether you use the more advanced language features or not, it's just a dog.
Unfortunately, the only other effective "live" compiler i know of is node-sass, which is VERY fast, but miserably far behind on SASS language support. You can't use it with more recent versions of Foundation (5.3+, if fuzzy memory serves).
Since you're using Foundation 4, you could try setting up Node & use node-sass to compile. i think it'll support the older F4 code, just make sure you don't use any SASS 3.3 language features (maps, for instance) in your own code.
I've been trying to install Sass on Gentoo, but it hasn't been going too well. Unfortunately, the latest version of Sass in portage is 3.1.21.
What I want to use Sass for requires at least Sass 3.2, which is available through rubygems.
What I've tried:
emerge dev-ruby/sass (installs an old version)
gem install sass
The second command appears to install the Sass gem. However, I do not use Rails or Ruby in any other aspect apart from Sass, so the gem appears useless to me. In addition, I do not know where gems are installed to or how to use them (I'm a ruby noob.) All I want to do is call sass from the command line.
Are there any ways to obtain an up-to-date version of Sass which I can just use from the command line?
Cheers.
On Gentoo, user-installed gems are not in your PATH by default. I have created a bug report because while user-installed gems work much better than they used to, this problem really needs to be rectified. You can help by voicing your opinion in the report and linking back to this page. To get things working, you can either deploy the script I uploaded to the report or use RVM instead, which will give you much more consistent behaviour across distros.
I'm wondering but all the answers looks weird for me. One of the biggest gentoo advantage is ebuild writing which is easy as pie so every user can contribute whatever he needs.
Add local overlay
fork upstream ebuild to your local overlay
bump version
use
test
attach tested ebuild to bug report, maybe also contact someone on #gentoo-dev-help
Trust me, using gem (or cabal, or whatever) instead of your package manager if way to mess your system.
Some might find useful to know that under Gentoo you can install sass using emerge which will solve the PATH problem some people are encountering.
# emerge -av sass
after which you should be able to use sass without problem.
Another solution would be to use rvm which could make things more portable and uniform across environments.
edit: in case someone's asking: to install rvm just follow the instructions found at: https://rvm.io/rvm/install/ and install the stable version.
I don't see a down side to using the gem version of Sass. I'm also not a Ruby/RoR developer (I use Haskell/PHP), and I just use the gem. I know just enough about gems to install/uninstall them, and that seems good enough for using Sass.
Installing and upgrading Sass is done with the same command:
sudo gem install sass
Installing Sass via gems gives you the ability to use it via command line, just like it shows on the official website: http://sass-lang.com/.
sass --watch style.scss:style.css
Other command line options can be found via --help or on their docs: http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#using_sass
sass --help
Consider using compass it will accepts command lines like: compass [YOUR-FILE].sass and can also compass watch [SASS FOLDER] and 'compile' css to it.
http://compass-style.org/
To install using a gem
gem update --system
gem install compass
Installation