直接卸载node-sass、安装sass后90%项目可运行，但剩余10%存在路径解析、除法运算、@import规则和深度选择器四类兼容性问题；需同步升级sass-loader、修正语法、清理配置并统一使用.scss后缀。

直接卸载 node-sass、装上 sass，90% 的项目能立刻跑起来——但剩下那 10% 的“能跑”不等于“没报错”，真正卡住的是路径解析、除法运算、@import 规则和深度选择器这四类语法差异。

为什么 npm uninstall node-sass && npm install sass 不够用

Dart Sass 不是 node-sass 的“升级版”，而是 Sass 官方语言规范的唯一实现；它拒绝 LibSass 长期以来的宽松解析习惯。常见现象包括：

• SassError: expected selector —— 多半是 /deep/ 或 >>> 写法被直接拒收
• 10px / 2 报错：LibSass 默认当数学除法，Dart Sass 当 CSS 除法（需写成 (10px / 2)）
• @import "utils/mixins" 编译失败：Dart Sass 不再自动补 .scss 后缀，且 Windows 下反斜杠 \ 被当转义符处理
• sass-loader 仍调用 node-sass：旧配置里残留 implementation: require('node-sass') 或版本不匹配

必须同步升级 sass-loader 并清理残留

sass-loader 是 Webpack 和 Sass 编译器之间的胶水，它的 API 与底层实现强绑定：

• Webpack 5+ 必须用 sass-loader@^12.6.0 或更高（推荐 @13.3.2）
• Webpack 4 可用 sass-loader@10.4.2（最后兼容版）
• 执行 npm uninstall node-sass sass-loader，再 npm install -D sass sass-loader@^13
• 删掉 node_modules 和 package-lock.json，彻底重装——否则旧 binding 可能残留
• 检查所有配置：Vue CLI 用户确认 vue.config.js 中无 nodeSass 字段；Webpack 用户确保 sass-loader 配置里没硬编码 implementation

Vue 项目里 /deep/ 和 ::v-deep 怎么办

这不是 Sass 的问题，而是 Vue scoped 样式机制 + Dart Sass 解析器叠加导致的语法冲突：

用于自动切换项目中适合的node 版本

根据 package.json 中的 engines 字段自动检测 Node.js 版本需求，未安装 nvm 时自动安装并切换至对应版本。支持 Windows、macOS、Linux。适用于 Node.js 项目开发、版本切换和环境配置。

下载

• /deep/ 是非标准写法，Dart Sass 直接当无效 selector 报错
• ::v-deep 是伪类，但 Vue 2 的 vue-loader 会把它转成 class，而 Dart Sass 不允许伪类出现在 @import 或嵌套块中
• Vue 3 推荐改用 :deep()；Vue 2 建议升级 vue-loader@15.9+ 后用 >>>
• 临时方案：把含深度选择器的样式抽成独立 .css 文件，用 引入，绕过 Sass 解析

迁移后编译变慢？先看缓存和内存，别急着回退

Dart Sass 纯 JS 实现，冷启动略慢是事实，但热更新和增量构建反而更快：

• 首次启动慢 ≠ 持续慢：开启 cache（sass-loader 默认已启用，确认未被覆盖）
• 检查是否误启用了 sourceMap: true 且未配 devtool: 'cheap-module-source-map'，这会显著拖慢
• 大型项目建议加 additionalData 统一注入变量，避免每个文件重复 @use
• 真正拖慢的往往不是 Dart Sass 本身，而是某处残留的 nodeSass 字段、loader 链中插件覆盖了输出顺序，或 CI 环境里缓存了旧 node_modules

最常被忽略的一点：Dart Sass 默认只支持 .scss 后缀，完全不识别缩进语法的 .sass 文件。如果项目混用，必须先统一转成 .scss 再迁移——否则连第一行都解析不了。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！