node16.0版本 对应node-sass sass-loader 各个版本号

"node-sass": "^6.0.1",
    "sass-loader": "^10.0.1",

试了半天啊 我真的泪目了 希望给各位省点时间吧（有用的话点个关注谢谢）

node-sass - npm

认准对应的node版本号 确定好一个后来回切换即可 容错率很高

sass 使用

安装

node-sass sass-loader的问题 出现了版本的问题 版本太高 版本不兼容
解决方法： cnpm i node-sass@4.14.1 cnpm i sass-loader@7.3.1 --save-dev

在build文件夹下的webpack.base.conf.js的rules里面添加配置 

// 如果你是.sass文件要设置
{
  test: /\.sass$/,
  loaders: ['style', 'css', 'sass']
}

使用

$back: red
#app
  color: $back
// 变量声明也分为全局变量和局部变量 

// 这样也是好用的

$highlight-color: #F90;
$highlight-border: 1px solid $highlight-color;
.selected {
  border: $highlight-border;
}

//编译后

.selected {
  border: 1px solid #F90;
}

 嵌套css规则

#content {
  article {
    h1 { color: #333 }
    p { margin-bottom: 1.4em }
  }
  aside { background-color: #EEE }
}

 /* 编译后 */
#content article h1 { color: #333 }
#content article p { margin-bottom: 1.4em }
#content aside { background-color: #EEE }