NPM镜像源及cnpm

NPM镜像

推荐配置

查看当前镜像

npm config list

设置镜像

npm config set registry https://registry.npmmirror.com/
npm cache clean -f
npm config list

其中npm config提供的参数：

• registry 是设置依赖的镜像
• disturl是设置Node的镜像
• sass_binary_site是sass的镜像
• electron_mirror是electron的镜像
• python_mirror是python的镜像

新版本除了registry，其他都没法用命令设置了

我们可以编辑文件

npm config edit

添加

registry=https://registry.npmmirror.com/
disturl=http://npmmirror.com/mirrors/node/
electron_mirror=http://npmmirror.com/mirrors/electron/
python_mirror=http://npmmirror.com/mirrors/python/
sass_binary_site=http://npmmirror.com/mirrors/node-sass/

华为镜像

华为开源镜像站同时也提供了工具类加速镜像：

npm config set registry https://mirrors.huaweicloud.com/repository/npm/
npm cache clean -f

※ 设置nodejs工具的镜像地址

npm config set disturl https://repo.huaweicloud.com/nodejs

※ 设置Electron和Python的镜像地址

npm config set electron_mirror https://repo.huaweicloud.com/electron/
npm config set python_mirror https://repo.huaweicloud.com/python

※ 设置浏览器引擎驱动镜像地址

npm config set phantomjs_cdnurl https://repo.huaweicloud.com/phantomjs
npm config set chromedriver_cdnurl https://repo.huaweicloud.com/chromedriver
npm config set operadriver_cdnurl https://repo.huaweicloud.com/operadriver

※ 设置Node-Sass的镜像地址

npm config set sass_binary_site https://repo.huaweicloud.com/node-sass

淘宝镜像

npm config set registry https://registry.npm.taobao.org/
npm config set disturl https://npm.taobao.org/mirrors/node/

npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/
npm config set electron_mirror https://npm.taobao.org/mirrors/electron/
npm config set python_mirror https://npm.taobao.org/mirrors/python/

npm config set sharp_dist_base_url https://npm.taobao.org/mirrors/sharp-libvips/
npm config set puppeteer_download_host https://npm.taobao.org/mirrors/
npm config set phantomjs_cdnurl https://npm.taobao.org/mirrors/phantomjs/
npm config set sentrycli_cdnurl https://npm.taobao.org/mirrors/sentry-cli/
npm config set sqlite3_binary_site https://npm.taobao.org/mirrors/sqlite3/

Electron镜像

查看配置文件的位置

npm config list

可以查看到本机的userconfig在哪，即.npmrc文件在哪

比如我的

userconfig C:\Users\Jian\.npmrc

打开该文件 添加

registry=https://registry.npmmirror.com
electron_mirror="https://npm.taobao.org/mirrors/electron/"

仅适用于中国区客户

MacOS

# macOS
export ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"
export ELECTRON_CUSTOM_DIR="7.1.14"
export SASS_BINARY_SITE="https://npm.taobao.org/mirrors/node-sass/"
export ELECTRON_BUILDER_BINARIES_MIRROR="https://npm.taobao.org/mirrors/electron-builder-binaries/"

npm install --registry=https://registry.npm.taobao.org

Windows

# Windows
set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/
set ELECTRON_CUSTOM_DIR=7.1.14
set ELECTRON_BUILDER_BINARIES_MIRROR=https://npm.taobao.org/mirrors/electron-builder-binaries/
set SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/

npm install --registry=https://registry.npmmirror.com

cnpm

npm install cnpm -g

如果使用npm下载依赖的时候报错的话，我们可以使用cnpm

cnpm install

常见问题

sass安装报错

安装报错，版本不匹配

Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 12.x

更换版本即可"node-sass": "^4.12.0",

更换后

在项目目录下，分别执行一下两个命令：

npm rebuild node-sass

再执行

npm update

node-sass版本依赖关系

https://www.npmjs.com/package/node-sass

NodeJS	Supported node-sass version	Node Module
Node 19	8.0+	111
Node 18	8.0+	108
Node 17	7.0+, <8.0	102
Node 16	6.0+	93
Node 15	5.0+, <7.0	88
Node 14	4.14+	83
Node 13	4.13+, <5.0	79
Node 12	4.12+, <8.0	72
Node 11	4.10+, <5.0	67
Node 10	4.9+, <6.0	64

版本不匹配

问题描述：

不同依赖包之间的版本不匹配可能导致项目启动失败。

解决方法：

检查 package.json 文件中的依赖版本，确保所有依赖包的版本兼容。可以使用 npm outdated 命令查看哪些依赖包需要更新，然后使用 npm update 命令进行更新。

安装失败

问题描述：

在安装依赖包时，可能会因为网络问题或其他原因导致安装失败。

解决方法：

检查网络连接，确保能够访问 npm 仓库。

如果仍然无法安装，可以尝试更换 npm 源，

例如使用华为镜像源：

npm config set registry https://mirrors.huaweicloud.com/repository/npm/
npm cache clean -f

处理 Vue CLI 版本冲突

检查全局版本：

使用 vue --version 命令查看全局安装的 vue-cli 版本，使用 npx vue --version 命令查看项目中使用的版本。

如果不一致，可以使用 npm install -g @vue/cli 命令更新全局版本。

使用 npx 命令：

在项目中使用 npx vue-cli-service serve 命令启动项目，确保使用的是项目中安装的 vue-cli 版本。

处理依赖冲突

检查 package.json 文件：

确保 package.json 文件中的 vue 版本与项目中其他依赖包的版本兼容。

可以使用 npm update vue 命令更新 Vue.js 核心库版本。

锁定版本：

在 package.json 文件中不使用 ^ 或 ~ 符号，锁定 依赖 版本，避免因版本变化导致的问题。

安装失败

style-resources-loader@”1.3.3” from the root project

预处理器安装

根据不同预处理器(Sass/Less/Stylus)，安装响应的webpack loader:

# Sass
npm install -D sass-loader sass

# Less
npm install -D less-loader less

安装style-resources-loader

# 使用vue add安装
vue add style-resources-loader