sass-loader与node-sass版本兼容问题_nuyoahso_sass版本

网络 02-07 6030

vue安装 sass-loader@7.3.1：

安装成功，

vue安装 node-sass报错： D:\keep\vue\vue-rent>npm install node-sass --save-dev npm ERR! code 1 npm ERR! path D:\keep\vue\vue-rent\node_modules\node-sass npm ERR! command failed npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node-gyp rebuild npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@7.1.2 npm ERR! gyp info using node@14.17.4 | win32 | x64 npm ERR! gyp info find Python using Python version 3.7.0 found at "D:\download\Python3.7.0\python.exe" npm ERR! gyp ERR! find VS npm ERR! gyp ERR! find VS msvs_version not set from command line or npm config npm ERR! gyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Prompt npm ERR! gyp ERR! find VS could not use PowerShell to find Visual Studio 2017 or newer, try re-running with '--loglevel silly' for more details npm ERR! gyp ERR! find VS looking for Visual Studio 2015 npm ERR! gyp ERR! find VS - not found npm ERR! gyp ERR! find VS not looking for VS2013 as it is only supported up to Node.js 8 npm ERR! gyp ERR! find VS npm ERR! gyp ERR! find VS ************************************************************** npm ERR! gyp ERR! find VS You need to install the latest version of Visual Studio npm ERR! gyp ERR! find VS including the "Desktop development with C++" workload. npm ERR! gyp ERR! find VS For more information consult the documentation at: npm ERR! gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows npm ERR! gyp ERR! find VS ************************************************************** npm ERR! gyp ERR! find VS npm ERR! gyp ERR! configure error npm ERR! gyp ERR! stack Error: Could not find any Visual Studio installation to use npm ERR! gyp ERR! stack at VisualStudioFinder.fail (D:\keep\vue\vue-rent\node_modules\node-gyp\lib\find-visualstudio.js:121:47) npm ERR! gyp ERR! stack at D:\keep\vue\vue-rent\node_modules\node-gyp\lib\find-visualstudio.js:74:16 npm ERR! gyp ERR! stack at VisualStudioFinder.findVisualStudio2013 (D:\keep\vue\vue-rent\node_modules\node-gyp\lib\find-visualstudio.js:351:14) npm ERR! gyp ERR! stack at D:\keep\vue\vue-rent\node_modules\node-gyp\lib\find-visualstudio.js:70:14 npm ERR! gyp ERR! stack at D:\keep\vue\vue-rent\node_modules\node-gyp\lib\find-visualstudio.js:372:16 npm ERR! gyp ERR! stack at D:\keep\vue\vue-rent\node_modules\node-gyp\lib\util.js:54:7 npm ERR! gyp ERR! stack at D:\keep\vue\vue-rent\node_modules\node-gyp\lib\util.js:33:16 npm ERR! gyp ERR! stack at ChildProcess.exithandler (child_process.js:397:5) npm ERR! gyp ERR! stack at ChildProcess.emit (events.js:400:28) npm ERR! gyp ERR! stack at maybeClose (internal/child_process.js:1055:16) npm ERR! gyp ERR! System Windows_NT 10.0.17134 npm ERR! gyp ERR! command "D:\\download\\node\\node\\node.exe" "D:\\keep\\vue\\vue-rent\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" npm ERR! gyp ERR! cwd D:\keep\vue\vue-rent\node_modules\node-sass npm ERR! gyp ERR! node -v v14.17.4 npm ERR! gyp ERR! node-gyp -v v7.1.2 npm ERR! gyp ERR! not ok npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\59486\AppData\Local\npm-cache\_logs\2021-10-25T16_33_25_148Z-debug.log

cnpm如何设置/取消淘宝镜像和清除淘宝镜像

npm设置/删除淘宝镜像

解决方案：解决办法：使用淘宝镜像完成安装 npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm install node-sass

安装完成后node-sass版本是6.1.0

运行项目报错 ERROR Failed to compile with 1 error 上午11:25:31 error in ./src/views/chat/FriendChat.vue?vue&type=style&index=0&id=2f3948a3&lang=scss&scoped=true& Syntax Error: Error: Node Sass version 6.0.1 is incompatible with ^4.0.0. @ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/ stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cach e-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/chat/FriendChat.vue?vue&type=style&index=0&id=2f3948a3 &lang=scss&scoped=true& 4:14-483 15:3-20:5 16:22-491 @ ./src/views/chat/FriendChat.vue?vue&type=style&index=0&id=2f3948a3&lang=scss&scoped=true& @ ./src/views/chat/FriendChat.vue @ ./src/views sync ^\.\/.*\.vue$ @ ./src/utils/menus.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js node-sass和sass-loader的版本冲突问题卸载旧版本的sass-loader：npm uninstall sass-loader 更改sass-loader的版本：npm install sass-loader@10.1.1 --save-dev

sass-loader@10.1.1安装成功

版本仍不兼容

sass-loader@10.1.1与@node-sass@6.1.0不兼容

Syntax Error: Error: PostCSS received undefined instead of CSS string

点击跳转，解决方法

node-sass和sass-loader的版本冲突问题卸载旧版本的node-sass：npm uninstall node-sass 更改node-sass的版本：npm install node-sass@4.14.1 --save-dev

最后版本兼容，运行成功