前端项目下载模块问题(node-sass问题多)

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

前言

---

一、下载步骤

使用node-sass需要先配置python3和Visual Studio工具环境，有些人没这些环境！！

## 查看网络最新node版本，LTS正式稳定版
# nvm list available
nvm install 20.11.0
#nvm切换版本失败，使用nvm on打开再切换。
#nvm on
nvm use 20.11.0
#设置npm配置，可以不设置，nvm有默认的，更换node版本设置需要重新设置。
npm config set prefix "C:\software\nodejs"
npm config set cache "C:\software\nodejs\node_cache"
#关闭下载模块验证，默认是开启的，可能会引发报错。
npm config set strict-ssl false
## 这个是下载cnpm配置，用的别的，这里这是记录作用。
## npm install -g cnpm -registry=https://registry.npm.taobao.org
#全局下载yarn，用于安装模块&运行等
npm install -g yarn
## 查看yarn配置，记录作用。
## yarn config list
#关闭下载模块验证，默认是开启的，可能会引发报错。
yarn config set strict-ssl false -g
#下载node-sass，可以不设置版本，需要配置python环境变量和Visual Studio工具，但是有环境可能还下不下来，但......npm能下载下来，yarn如果需要覆盖下载的操作，在下载的后面添加 --force 指令。
yarn add node-sass@9.0.0
#使用npm下载node-sass并且是覆盖下载。
npm rebuild node-sass@9.0.0
#再用yarn下载，因为npm下载报错，但是yarn不会。
yarn install
#启动项目
npm run serve 或者 yarn run serve

二、版本说明

nvm：1.1.11
node：20.11.0
npm：10.2.4
yarn：1.22.21
webpack: ^5.89.0
node-sass: ^9.0.0
sass-loader：未使用

注：nvm是node版本管理工具，需要自行下载 nvm-windows。

三、node-sass的环境依赖

1.python3

报错信息：

C:\WorkPlace\git \***\node_modules\node-sass:Command failed.

原因：node-sass需要python3环境

参考地址：https://blog.csdn.net/w15635748705/article/details/123355241
python下载地址：https://www.python.org/downloads/windows/

注：下载Stable Releases稳定版本的。安装python记得勾选path，添加环境变量，后面一直默认，最后一步点击不用使用长度限制。

2.Visual Studio工具

报错信息：

You need to install the latest version of Visual Studio

1. 网址下载（推荐）

1、使用https://aka.ms/vs/17/release/vs_BuildTools.exe下载2022版本的工具。
2、官网最下面点击`用于Visual Studio的工具`，再点击`Visual Studio 2022生成工具`下载
3、安装的时候需要勾选 桌面C++生成工具（每个版本叫法不一）
4、重新启动

参考地址：https://zhuanlan.zhihu.com/p/398279220

2. node下载（我下不下来）

npm i -g node-gyp      或者 yarn global add node-gyp
npm i -g --production windows-build-tools 或者 yarn global add windows-build-tools --production --force

注：windows-build-tools路径在国外，下载都会特别慢。–production只安装生产环境依赖。–force覆盖下载。

参考地址：https://blog.csdn.net/zwslovexyj/article/details/122119257

四、报错汇总

1、yarn安装模块报错（yarn install）

报错信息：

info No lockfile found.
[1/4] Resolving packages...
error Error: certificate has expired

处理方式：

-- 查看yarn的strict-ssl配置
yarn config list
-- 设置yarn配置的strict-ssl为false关闭
yarn config set strict-ssl false

参考地址：https://blog.csdn.net/Wjangia/article/details/135760090

2、yarn下载node-sass报错（有环境依赖）

下载指令：

yarn add node-sass@9.0.0

报错信息：

ERR!configure error gyp ERR!stack Error:'gyp'failed with exit code:1 gyp ERR

处理方式：

npm rebuild node-sass@9.0.0

注：yarn下载报错，npm下载node-sass可以下载下来。然后再使用yarn install后就可以启动项目。

3、启动前端项目报错

报错信息：

ERROR Error:The project seems to require pnpm but it's not installed.

处理方式：

npm install -g pnpm

参考地址：https://www.panziye.com/java/web/6419.html

五、其他

node-sass因为版本冲突引起相似报错

查看node和node-sass依赖关系：node-sass
参考别人的，忘记在哪里了，github的地址有时候访问不到，这个不是github的地址，挺好用的。

node安装cnpm报错

报错信息：

npm ERR! code CERT_HAS_EXPIRED
npm ERR! errno CERT_HAS_EXPIRED
npm ERR! request to https://registry.npm.taobao.org/cnpm failed, reason: certificate has expired

处理方式：

-- 清除缓存
npm cache clean --force
-- 配置关闭ssl，默认是开启的
npm config set strict-ssl false
-- 重新下载
npm install -g cnpm -registry=https://registry.npm.taobao.org

参考网址：https://www.ab62.cn/article/3076.html

npm和yarn指令区别

参考地址：https://segmentfault.com/a/1190000008632323

模块的下载说明

1、node安装的时候不要有中文路径或者非法字符，很麻烦。
2、node不要装C盘，装C盘需要用管理员权限打开密令行再下载。
3、全局模块：–global <=> -g
4、查看node版本：node --version 或者 node -v
5、查看yarn版本：yarn --version 或者 yarn -v
6、查看nvm版本：nvm -v
7、查看npm版本：npm --version 或者 npm -v
8、查看python版本：python -V

特别注意

配置环境变量，有些环境配了但是使用不了，需要重启电脑才会生效。

六、前端部署（待记录）

---

总结

说明：使用cnpm报webpack版本冲突，或者下不下来；使用yarn报没有node-sass需要的环境依赖；使用npm下载报错，无用信息太多无法甄别。所以采用了npm和yarn的混合下载方式。

感谢各位的帮助，还有很多参考的未写上去，感谢！！。