[关闭]
@jeffjade 2018-01-08T12:11:36.000000Z 字数 3663 阅读 1127

Yarn Npm 草稿

Toss


什么是 Npm,Yarn

什么是 npm?

npm 即:npm package manager ,是一种重用其他开发人员的代码的方法,也是一种与他人共享代码的方式,并且可以很容易地管理不同版本的代码。npm 开始作为 Node 包管理器,所以你会发现很多模块可以在服务器端使用。也有很多的包添加命令供您在命令行中使用。你还会发现可以在前端使用的软件包。

npm 由三个不同的部分组成:网站,注册表和 CLI 。该网站是用户发现软件包的主要工具,注册表是一个关于软件包信息的大型数据库,而 CLI 则是开发者如何在注册表上发布他们的软件包或下载他们希望安装的软件包。更多详细内容,可参见 what-is-npm

什么是 yarn?

Yarn 对你的代码来说是一个包管理器, 你可以通过它使用全世界开发者的代码,或者分享自己的代码。 Yarn 做这些快捷、安全、可靠,所以你不用担心什么。通过 Yarn,你可以使用其他开发者针对不同问题的解决方案,使自己的开发过程更简单。 使用过程中遇到问题,你可以将其上报或者贡献解决方案。一旦问题被修复,Yarn会更新保持同步。

Yarn 是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具。它并没有试图完全取代 npm。Yarn 同样是一个从 npm 注册源获取模块的新的 CLI 客户端。注册的方式不会有任何变化 —— 你同样可以正常获取与发布包。它存在的目的是解决团队在使用 npm 面临的少数问题。当然,在 Node 版本断更替中,Npm 本身也在积极更新。

关于安装/更新

如何安装/更新 Npm

如何安装 Npm

npm 开始作为 Node 包管理器,所以它的安装是跟 Node.js 捆绑在一起的。至于如何安装 Node.js, Npm 官方,在 Installing Node.js and updating npm 做了阐述。之前在不同平台尝试更新 Node.js 之时,也是遇到过各种问题,有在 NodeJs 升级/安装折腾记 一文做了记载;折腾许久,得出的结论跟官网一致:

如果您使用的是OS X或Windows,安装Node.js的最佳方法是:使用 Node.js下载页面中的一个安装程序。(笔者微注:如是我中国大陆用户,去淘宝 Node.js 镜像下载,会是快速的法子)。

如何更新 Npm

  1. npm install npm@latest -g (npm install npm -g)
  2. 更新(重新下载) Node.js

如何安装 Yarn

对于如何安装 Yarn,Yarn 官方给出了很全面的说明,详见 Install Yarn;涵盖 MacOs,Windows,Linux 等平台,并且还给出一些备用安装方式,譬如通过 npm 来安装:

  1. npm install --global yarn

当然,Yarn 官方在 Yarn 备选安装方式有明确讲道:

一般来说, 不推荐通过 npm 安装 Yarn,在用基于 Node 的包管理器安装 Yarn 时,该包未被签名, 并且只通过基本的 SHA1 散列进行唯一完整性检查。这在安装系统级应用时有安全风险。因为这些原因,高度推荐用你的操作系统最适合的方式来安装 Yarn。

但在实际使用中,这倒是最为方便的方式之一,迄今倒也没遇到什么问题;当然,最好按照官方推荐的方式;如果你使用并熟悉 Mac 操作系统,用推荐方式安装 Yarn 也是很简单:brew install yarn(笔者注)。

如何更新 Yarn

对于如何更新 Yarn,可以结合安装时候对应命令;如果是 Mac 操作系统,使用 brew 安装,那么如此操作予以更新:

  1. brew upgrade yarn

如果 Yarn 通过 Debian / Ubuntu 包安装,则可以运行如下命令予以更新:

  1. sudo apt-get update && sudo apt-get install yarn

也可以使用 yarn 本身来更新自己:

  1. yarn global add yarn

如果有意了解更多如何更新 yarn 的方法,可参见:yarn self-update should update using the same installation method originally used

关于 package-lock.json 和 yarn.lock

关于 yarn.lock

有时候一个项目周期很长,在不断开发的同时,而依赖的库也会有很大改变;有时候你可能只想运行 npm i 更新没有下载的插件,却不想偶尔会将依赖的一些其他插件更到最新,导致各种奇葩问题;package-lock.jsonyarn.lock 就是为解决这种问题而设定的存在。

使用 npm 或者 yarn,都会有 pacakge.json 这个文件,用以标出自己项目对 各库包的依赖。举个例子来说,你的项目中有如下依赖:

  1. "dependencies": {
  2. "jade-package": "^2.3.4"
  3. }

这其中的 ^ 是定义了向后(新)兼容依赖;在 npm<5.0 以前,如果 jade-package 的版本超过2.3.4,并在大版本号(2)上相同,就允许下载最新版本的 jade-package 库包,例如实际上可能运行npm i时候,下载的具体版本可能是2.5.8

多数情况下,这种向后兼容依赖下载最新库包,是没有问题的;然而,因为 npm 是开源世界,各库包的版本语义可能并不相同,不是所有开发者都能严格遵守这一原则:相同大版本号的同一个库包,其接口符合兼容要求。而且,不同的库包之间也存在其他依赖。理想状态下使用语义化版本发布补丁不会包含大的变化,但不幸的是这必非真理。npm 的这种策略,有可能导致两台拥有相同 package.json 文件的机子,实际上安装了不同版本的包,这可能导致一些错误。有时候,相同机器稍不留神的一个 npm i,就可能导致 node_modules 中安装的实际依赖被更新,也就可能导致项目运行呈现,被面目全非。

yarn.lock 就是为解决此问题而衍生的存在;为了跨机器安装得到一致的结果,Yarn 需要比你配置在 package.json 中的依赖列表更多的信息。 Yarn 需要准确存储每个安装的依赖是哪个版本;它类似于 npm 的 npm-shrinkwrap.json,并且无副作用。只是需要注意的是:

yarn.lock 文件是自动产生的,而且应该完全被 Yarn 管理。 当你用 Yarn CLI 增加/升级/删除依赖,它将自动更新你的 yarn.lock 文件。 不要直接编辑这个文件,那样很容易弄坏某些东西。

关于 package-lock.json

Node.js 升级之 v8.0 以后,自带的 npm 也升级到了5.0;带来速度上很大提升之外,也带来了其他很大变大;这其中就包括 package-lock.json:安装模块操作(改变 node_modules 文件夹内容)会生成或更新 package-lock.json 文件;package-lock.json 之于 npm,即是yarn.lcok 之于 yarn 的翻版;更多信息可参见 npm package-lock.json

另外,值得一提的是,在 Github 上有人专门提供了 Synp 工具,用以:将yarn.lock转换为package-lock.json,反之亦然(Convert yarn.lock to package-lock.json and vice versa)。


寻找适宜的 npm 包

找到合适的软件包可能相当具有挑战性 ——,毕竟有成千上万个模块供你选择。https://npms.io/ ,这个网站的存在,让这项任务轻松很多;它显示了质量受欢迎程度维护等指标。这些计算是基于模块是否具有过时的依赖关系,是否配置了linters,是否包含测试或是否进行了最近的提交。

https://blog.risingstack.com/nodejs-at-scale-npm-best-practices/

调查 npm 包

一旦我们选择了我们的模块,我们应该看看文档,并检查开放的问题,以更好地了解我们将要在我们的应用程序中需要什么。不要忘记,您使用的 npm 包越多,存在易受攻击或恶意攻击的风险就越高。

如果你想从cli打开模块的主页,你可以这样做:

  1. npm home axios

要检查未决的问题或公开的路线图(如果有的话),你可以试试这个:

  1. npm bugs axios

另外,如果你只是想检查模块的 git 仓库,请输入:

  1. npm repo axios

有趣的网站设计;
https://tipe.io/

解决 SEO 问题
https://prerender.io/
http://codingfishman.github.io/2016/05/06/prerender%E9%A2%84%E6%B8%B2%E6%9F%93%E4%BC%98%E5%8C%96SEO/

http://lon.im/post/use-environment-variables-better-in-front_end.html

https://www.alibabacloud.com/help/zh/doc-detail/50134.htm


碉堡动画
https://codepen.io/steveg3003/pen/wdBRZN

添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注