npm 镜像科普

发表于 | 分类于 | 评论数：


npm

作为新时代的前端，怎么也不避开踩 npm 这个大坑。

从安装模块开始

当你开开心心根据教程安装好 node 准备学习大前端知识的时候。
例如学习 vue, react 或者是 webpack 的时候。

1
$ npm install -D webpack

等了N久才安装完成，我本地实测 41.782s 才安装好。

然后下一步，加个 sass 模块。

1
$ npm install -D node-sass

苦苦等待，各种安装不上，有的运气好，3，5分钟终于安装上了。

因为 node-sass 是直接从 GitHub 下载的，一些测试类型的模块甚至都直接被墙，完全无法安装。

cnpm

好在国内有个非常棒的 npm 镜像站 淘宝 NPM 镜像。
他们非常良心的将 npmjs.org 所有模块都下载到了自己的服务器上，这样当我们使用 cnpm 的时候是完全从淘宝服务器下载的，而不再是去国外官网下载了。

1
$ npm install -g cnpm --registry=https://registry.npm.taobao.org

也许你担心模块是不是最新的，或者你新模块他会不会安装不了。
淘宝镜像10分钟同步一次以保证尽量与官方服务同步。

当你发布新模块的时候，也许他没有立刻同步，但你通过他的镜像安装模块时，
他发现自己网站没有这个模块，就立刻到 npmjs.org 下载到淘宝镜像服务器，然后返回给你。

所以不需要担心模块是否最新和有没有的问题。

npm 配置镜像 (原理篇)

ps: 其实这就是 cnpm 帮我们做的事情，我们手动做一遍。

如果你有洁癖，不想使用 cnpm 等第三方模块管理器。
那你可以配置 npm 为淘宝镜像，之后安装就会通过淘宝镜像安装了。

1
$ npm set registry https://registry.npm.taobao.org

现在你可以走淘宝镜像安装模块了。
但你会发现 node-sass, electron, puppeteer 等模块依然安装不了，或者安装非常缓慢。
还有一些需要模块是 c/c++ 写的，npm install 后在本地编译安装的，这种模块也安装的非常缓慢。

这是为什么呢？

基于 node 源码镜像 本地编译模块

先说本地编译的模块，他是依赖 node 源码的，所以会去下载一份对应版本的 node 源码。
注意，是对应版本的 node 源码，如果有一个模块依赖 node6 他会下载 node6 源码，另一个依赖 node8 就会下载 node8 源码。
而源码依然是从国外官网下载的，所以我们需要配置源码镜像。

ps: node8 带来了 N-API 所以这个时代会过去的。

1
$ npm set disturl https://npm.taobao.org/dist

本地编译的模块可以大幅度提升安装速度。
剩下最后一个问题，也是最蛋疼的问题了，模块依赖的资源文件下载。

模块依赖的资源文件下载

例如 node-sass 模块，第一次安装的时候会发现他从 GitHub 下载一个 .node 文件。

https://github.com/sass/node-sass/releases/download/v4.9.0/darwin-x64-57_binding.node

由于大家都懂的原因，GitHub 本身访问的时快时慢，而他的资源服务器更是慢如蜗牛。
所以我们需要单独配置这个资源的镜像。

很幸运，淘宝镜像中提供了 node-sass 镜像。
官网也给了安装命令:

1
$ SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass npm install node-sass

这么大一段命令，正常人应该记不住，需要每次都过来复制黏贴。
而且很多时候我们都直接在项目中 npm install 安装所有模块，而不是一个一个模块安装的。
所以要么作为别名加到 shell 中，要么有其他更好的方式解决。

幸运的是有个 mirror-config-china 模块：

1
$ npm i -g mirror-config-china --registry=https://registry.npm.taobao.org

他帮我们配置了这些常用的资源镜像。
其实他就是在 ~/.npmrc 中添加了一些配置，我们可以手动添加这些配置，如下。

1
2
3
4
$ npm set sass_binary_site https://npm.taobao.org/mirrors/node-sass
$ npm set electron_mirror https://npm.taobao.org/mirrors/electron/
$ npm set puppeteer_download_host https://npm.taobao.org/mirrors
$ npm set chromedriver_cdnurl https://npm.taobao.org/mirrors/chromedriver

这里例举了 node-sass, electron, puppeteer, chromedriver 模块，详细信息可以去看 mirror-config-china 模块。

cnpm 内置资源镜像

上面做了这么多努力，其实 cnpm 已经内置了 模块镜像，node源码镜像，常用依赖资源镜像。
甚至一些模块是不支持配置资源镜像的，cnpm 会强行替换模块内安装脚本中的安装地址。
所以如果你想一劳永逸，那么直接使用 cnpm 吧。

yarn

相信不陌生了吧，我更是在几个技术群里安利一年多了。
yarn 不走镜像，安装也挺快的，但依然也会卡在 依赖资源 的安装上。
但好在 yarn 会加载 ~/.npmrc 配置，也就是我们配置了 npm 的镜像，yarn 就可以使用。
那么棒棒的，可以愉快的使用 yarn 了。

在多啰嗦一句，yarn 的安装，很多人被官网例子给坑了，其实他就是个 npm 模块。

1
$ npm i -g yarn

就安装好了。

小结

其实很早就想写这个分享了，这次正好有人问到，就写下来分享。
很多人完全不理解 npm, cnpm, yarn，甚至还有混用的，然后各种踩坑。
下次有机会继续分享模块安装原理，以及为什么不能混用模块管理器。