What are the installation methods of SASS
This article mainly shows you "what are the installation methods of SASS", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "what are the installation methods of SASS" this article.
SASS is a dynamic style language, is an auxiliary tool to strengthen CSS, it in CSS grammar based on the addition of variables, nesting, mixing, import, function of advanced functions, these extensions make CSS more powerful and elegant, contribute to better management of style files, as well as more efficient development projects.
NPM installation
We can use npm (introduction to NPM usage) to install Sass.
Npm install-g sass
Note: domestic npm recommends using Taobao image to install. Refer to: NPM domestic slow problem solving.
Install on Windows
We can use Windows's package manager Chocolatey to install:
Choco install sassMac OS X (Homebrew) installation
Mac OS can be installed using the Homebrew package Manager:
Brew install sass/sass/sass
More installation methods can be found on the official website: https://sass-lang.com/install
Introduction to use
Our tutorial uses the sass installed by npm, and you can view the version after installation:
$sass-version 1.22.12 compiled with dart2js 2.5.0 next let's create a runoob-test.scss file with the following contents: runoob-test.scss file code:
/ * define variables and values * / $bgcolor: lightblue;$textcolor: darkblue;$fontsize: 18pxPlaced * use the variable * / body {background-color: $bgcolor; color: $textcolor; font-size: $fontsize;}
Then enter the following command on the command line to convert the css code from the .scss file:
$sass runoob-test.scss@charset "UTF-8"; / * define variables and values * / / * use variables * / body {background-color: lightblue; color: darkblue; font-size: 18px;}
We can save the code to the file followed by a .css file name:
$sass runoob-test.scss runoob-test.css
This will exist the runoob-test.css file in the current directory. The code is as follows:
@ charset "UTF-8"; / * define variables and values * / / * use variables * / body {background-color: lightblue; color: darkblue; font-size: 18px;} / * # sourceMappingURL=runoob-test.css.map * /
The above is all the contents of the article "what are the installation methods of SASS?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!