Detailed installation using Sass ----- in Vue project (scss), novice to follow suit

Tip: Do not install other environments - Online elsewhere say the installation rubby? Environment, which do not - -

Vue project on installation scss--

1. Create a new project using vue-cli template:

vue init webpack myvue

2. Installation sass dependencies, input interface in cmd:

npm  install sass-loader --save-dev

npm install node-sass --sava-dev

3. Add in the build configuration folder under the rules inside webpack.base.conf.js

{

test: /\.scss$/,

loaders: ['style', 'css', 'sass']

}

 

4. Use scss time to add lang = "scss" to apply the style corresponding syntax style tag is located, otherwise an error

scss use the test: change the font color test as follows

<style lang="scss">

$color:blue;

div {color:$color;}

</style>

 

 

 

5. Effect