Use the sass configuration method in the vue project.

Use the sass configuration method in the vue project.

1. Create a new project based on the webpack Template

$ Vue init webpack myvue

2. Install the dependency in the current directory

$ Cd myvue $ npm install

3. Install the sass dependency package

Npm install -- save-dev sass-loader // sass-loader depends on node-sassnpm install -- save-dev node-sass

4. Add the configuration in the rules of webpack. base. conf. js in the build folder.

{Test:/\. sass $/, loaders: ['style', 'css ', 'scss']}

As shown in:

5. Modify the style label in APP. vue.

<Style lang = "scss">

6. Run the project

$ Npm run dev

7. Modify the APP. vue style to see the effect.

8. Is the running result background dimmed? indicates that sass has been successfully configured.

Summary

The above section describes how to use sass configuration in the vue project. I hope it will be helpful to you. If you have any questions, please leave a message for me, the editor will reply to you in a timely manner. Thank you very much for your support for the help House website!