When I created the project with 2.0 today, I have been unsuccessful in using scss, and kept reporting errors............
Record it to prevent stepping on the pit next time
1. Install dependencies
vue's webpack project needs to install node-sass, sass-loader and style-loader, so in the project, run it again:
npm i node-sass sass-loader style-loader -D
After running the above command, you will see the corresponding version number in the "devDependencies" property in the package.json file.
2. Configure loader
Find the webpack.base.conf.js file in the build directory of the project. Add a loader explaining the scss file to the module.rules in the file module.export. The specific method is to add an object to the array. The content of the object is as follows
{
test: /\.scss$/,
loader: 'sass-loader!style-loader!css-loader',
}
3. Specify the language as scss
Add lang="scss" to the style tag of the .vue file, and write it as follows:
<style lang="scss" scoped>
</style>
Through the above steps, you can use sass in the project.
emm I followed this procedure for N times and still reported an error. The final solution:
look at our package.json file, the sass-loaderdownload is the latest version, this is not possible.
We specify the download version:
npm i [email protected] -S
After downloading, restart the project to use SCSS normally! !
If you have not succeeded, please leave a message and we will solve it together