Nodejs a tutorial on automatically generating CSS files using the SASS Framework Listener Project

Source: Internet
Author: User

Used to get scss only under Ruby, Nodejs version less.js has been more mature, and sass.js (1) does not support SCSS (after the author to develop stylus ~), followed by the SCSS-JS (2) has missed the opportunity (support SCSS Syntax Limited, has not been updated for a long time).
This is probably a cause of the current less in the domestic outbreak. Excluding environmental dependence, personal feeling sass than less much better, I believe many students also think so ~
Compared to the current 4 kinds of CSS preprocessing syntax: Sass (SCSS)/less/stylus/closure-stylesheets, or prefer scss.

Using Nodejs to write gadgets is quite appropriate, but before the sass under Nodejs no better than package. Finally Node-sass (3) appears, the current NPM best sass package, tested some SCSS files are basically OK, syntax error will also return the wrong message.

Based on Node-sass wrote a small tool, listening to the project directory, when the folder of the. scss file is modified immediately compiled into a CSS file, using:
1. Sudo/path/scss.js # Loads a written configuration to listen for multiple items;
This method is recommended to write the configuration information of multiple projects to scssconfig.js without additional parameters.
2. Sudo/path/scss.js-build # reads all. Scss and compiles into a. css file;
3. Sudo/path/scss.js-clear # Clears error log (if LogDir path is configured in scssconfig.js);
4. sudo/path/scss.js/path/project1//path/lib/to temporarily monitor Project1 directory, lib for. Scss @import Path (no @import, can be omitted);

SOURCE Stacking in: https://github.com/kairyou/f2e-tools/tree/master/scss

Comes with problems with using node-sass and how to fix them:
1. Error reading values after:
Error reading value, may be color error is not 6-bit or 3-bit, such as: color: #abcde;
2. Scss inside Write: @charset "UTF-8"; Will complain: top-level blockless directive must be terminated by '; '
@see: HTTPS://GITHUB.COM/ANDREW/NODE-SASS/ISSUES/23
3. Error reading values after Opacity/progid
Use: Unquote ("..."); @see: HTTPS://GITHUB.COM/HCATLIN/LIBSASS/ISSUES/72

The article mentions the Sass several package link:
1) sass:https://github.com/visionmedia/sass.js
2) Scss:https://github.com/bmavity/scss-js
3) Node-sass:https://github.com/andrew/node-sass

With the Nodejs version, other languages (not Ruby), such as PHP phpsass/scssphp can be ignored ~

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.