The road to torture

My new colleague ran my previous project and couldn’t run it. He kept reporting Node-sass’s fault. It took a long time and didn’t solve it.

found

  • Colleague versionnodeWith my localnodeThe version is different. He is16 +I am a14 +It’s too painful. After the query information, foundnodeCorresponding to each versionsassdifferent

1. Node-sass is used accurately

Node – sass corresponding table

reference

Node 16 correct version posture

  • package.json
"node-sass": "^ the 6.0.1." "."sass-loader": "^ 10.0.1." ".Copy the code
  • vue.configl.jsGlobal variables are also modified
loaderOptions: {
  sass: {
    // Either of the following is ok
    additionalData: `@import "~@a/scss/entrance.scss"; `/ / sass - laoder 10 + version
    //prependData: `@import "./src/assets/scss/entrance.scss"; '// Sass-loader 8+ version
  },
Copy the code

Matches node-sass with sas-loader

sass-loader 4.11.The node - sass4.3. 0
sass-loader 7.03.The node - sass4.72.
sass-loader 7.31.The node - sass4.72.
sass-loader 7.31.The node - sass4.141.
Copy the code

The Node management tool NVM is recommended

  • This allows you to switch back and forth between Node versions to suit different project environments.

NVM reference

Dart-sass is more recommended

  • The mainstream direction from now on isdart-sass
  • use

1. Uninstall Node-sass. 2

"sass": "1.32"."sass-loader": "^ 10.0.5".Copy the code

3, encountered warning problems, refer to issues, degradation can be achieved