2021/02/22 vue项目安装node-sass、sass-loader报错记录
node-sass
:rainbow: Node.js bindings to libsass
项目地址:https://gitcode.com/gh_mirrors/no/node-sass
免费下载资源
·
- 背景:用vue 脚手架新建了个项目,打算用scss写样式,第一次用,就一直报错一直报错。
- 快捷通道
如果不想看多个报错原因的,可以直接卸载安装好的node-sass和sass-loader,然后安装 “node-sass”: “^4.14.1”, “sass-loader”: “^7.3.1”,运行项目试试。看最后总结。 - 报错1:Failed to resolve loader: sass-loader
–意思是项目没有安装sass-loader插件
–按以下图片方法直接安装,运行报错
- 报错2:Syntax Error: TypeError: this.getOptions is not a function
–按上图安装的都是最新版的
–原因:可能是saas-loader安装的版本太高
–卸载saas-loader,重新安装低版本7.3.1,如果版本7.3.1不行可以安装6.X 参考这里
卸载sass-loader
npm uninstall --save sass-loader
安装sass-loader指定版本
npm install -D saas-loader@7.3.1
–运行项目,又报错
- 报错3:npm ERR! Failed at the node-sass@5.0.0 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
–原因 应该是node-sass的问题
–解决方法 把sass-loader 、node-sass都删掉,先安装sass-loader 再安装node-sas。(这里不知道为什么,看网上的反正按这个顺序做)
卸载sass-loader
npm uninstall sass-loader
卸载node-sass
npm uninstall node-sass
重新安装scss-loader的版本 安装7.3.1版本
npm install sass-loader@7.3.1 --save-dev
安装node-sass
npm install --save-dev node-sass
–运行 继续报错
- 报错4: Syntax Error: Error: Node Sass version 5.0.0 is incompatible with ^4.0.0.
–原因 参考
因为Error:Node Sass version 5.0.0 is incompatible with ^4.x 问题,此错误来自sass-loader.因为node-sass@latest为v5.0.0,而sass-loader期望值为^4.0.0,当不加版本号时默认会下载最新版(即5.0.0版本)
–解决方法 卸载node-sass ,用以下指令
npm i node-sass@4.14.1 --sass_binary_site=https://npm.taobao.org/mir
rors/node-sass/
–好家伙,又报错了
- 报错5: Error: node-sass@4.14.1 postinstall:
node scripts/build.js
–原因 网速不好,sass版本太高 参考
–按照上图方法来,我以为是淘宝镜像的问题,反正没有成功
–最终解决方法
卸载node-sass,用以下指令重新安装,两种都可以,一个留在package.json里了,一个没有
npm i node-sass@4.14.1 --sass_binary_site=https://npm.taobao.org/mirrors/node-sass
这个指令用cnpm安装更快
npm i --save-dev node-sass@4.14.1 --sass_binary_site=https://npm.taobao.org/mirrors/node-sass
- 总结
–1.先安装sass-loader ,再安装node-sass(没有再测试顺序了,不想弄了,反正我是这个顺序成功的)
–2.sass-loader安装7.3.1,node-sass安装4.14.1
–3.如果遇到报错Error: node-sass@4.14.1 postinstall:node scripts/build.js
,直接卸载node-sas用‘报错5’里面的两个指令来
GitHub 加速计划 / no / node-sass
8.5 K
1.33 K
下载
:rainbow: Node.js bindings to libsass
最近提交(Master分支:2 个月前 )
6081731a
Bumps [actions/setup-node](https://github.com/actions/setup-node) from 3 to 4.
- [Release notes](https://github.com/actions/setup-node/releases)
- [Commits](https://github.com/actions/setup-node/compare/v3...v4)
---
updated-dependencies:
- dependency-name: actions/setup-node
dependency-type: direct:production
update-type: version-update:semver-major
...
Signed-off-by: dependabot[bot] <support@github.com> 9 个月前
62c0f46c
Bumps [actions/checkout](https://github.com/actions/checkout) from 3 to 4.
- [Release notes](https://github.com/actions/checkout/releases)
- [Changelog](https://github.com/actions/checkout/blob/main/CHANGELOG.md)
- [Commits](https://github.com/actions/checkout/compare/v3...v4)
---
updated-dependencies:
- dependency-name: actions/checkout
dependency-type: direct:production
update-type: version-update:semver-major
...
Signed-off-by: dependabot[bot] <support@github.com> 9 个月前
更多推荐
已为社区贡献2条内容
所有评论(0)