vue node_modules\node-sass: Command failed. 安裝失敗，如何解決，使用 sass 替換
一、問題
package.json
"node-sass": "^xx.xx.xx",
"sass-loader": "^xx.xx.xx",
vue 項目中，安裝依賴的時候出現(xiàn)錯誤，如下：
error D:\proj\cscec-8bur-vms\dashboard-vuejs\node_modules\node-sass: Command failed.
Exit code: 1
Command: node scripts/build.js
Arguments:
Directory: D:\proj\cscec-8bur-vms\dashboard-vuejs\node_modules\node-sass
Output:
二、原因
package.json 中有個 node-sass 的包，在安裝并編譯這個的時候出現(xiàn)問題
三、解決辦法
node-sass 的主要功能是將 sass/scss -> css ，跟 sass 的作用是一樣的， sass 是 dart 語言寫的，
直接用 sass 替換掉 node-sass 即可
"sass": "^xx.xx.xx",
"sass-loader": "^xx.xx.xx",
四、其它
在使用 vue create appName 創(chuàng)建 vue 項目，手動配置項目框架內(nèi)容時，可以手動選擇 sass/scss 的插件，之前我都是默認選 node-sass ，現(xiàn)在我只用 sass，讓這個編譯給煩透了。
五、替換 sass 后需要注意的問題
將 node-sass 替換成 sass 之后，需要注意一個問題：node-sass 默認支持并包容以下關于除法的寫法：
.item{
width: $widthHole / 4;
}
但 sass dart 版的不包容這個寫法：在編譯項目的時候會提示：
Recommendation: math.div(($height-message - 20) * 2, 3) or calc(($height-message - 20) * 2 / 3)
More info and automated migrator: https://sass-lang.com/d/slash-div
?
702 │ line-height: ($height-message - 20) * 2/3;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
?
src\views\Screen\Screen.vue 702:30 root stylesheet
意思是 sass 不推薦直接使用 / 作除法運算，將在以后的版本中摒棄，請改用 math.div() 這種寫法。
這也能理解，因為在 css 中已經(jīng)存在使用 / 的情況，像 font 的縮寫：
.title{
font:italic bold 12px/30px Georgia, serif;
}
所以比如：
.item{
width: $widthHole / 4;
}
在 dart-sass 中就需要改寫為：
@use "sass:math";
.item{
width: math.div($widthHole, 4);
}
使用 math.div() 需要在 scss 文件的開頭引入 @use "sass:math";
scss 的具體使用方法，可以參見： https://kylebing.blog.csdn.net/article/details/89738636文章來源：http://www.zghlxwxcb.cn/news/detail-437175.html
六、結(jié)
這樣，就可以正常使用 scss/sass 了。文章來源地址http://www.zghlxwxcb.cn/news/detail-437175.html
到了這里，關于vue node_modules\node-sass: Command failed. 安裝失敗，如何解決，使用 sass 替換的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！
