什么是Yarn?
在 JavaScript 社区中,工程师们互相分享成千上万的代码,帮助我们节省大量编写基础组件、类库或框架的时间。每个代码包可能都依赖于其他代码,而代码间的依赖关系则由包管理器负责维护。目前最流行的 JavaScript 包管理器是 npm 客户端,在 npm 仓库中提供了多达 30 万的软件包。据统计,已有超过 500 万的工程师使用 npm 仓库,其软件包下载量达到了 50 亿次/月。
在 Facebook 中,我们多年来一直在使用 npm 客户端并取得了成功,但随着代码仓库与团队人数的增长,我们在一致性、安全性以及性能方面遇到了挑战。在尝试解决每个方面的问题后,我们最终决定着手打造一套新的客户端解决方案,以帮助我们更可靠地管理依赖。我们把这个客户端工具称为 Yarn —— 更加快速、可靠、安全的 npm 客户端的替代品。
我们在此荣幸地宣布,我们与 Exponent、 Google 和 Tilde 进行了合作,并开源 Yarn 项目。工程师在使用 Yarn 时,依然需要访问 npm 仓库,但 Yarn
能够更快速地安装软件包和管理依赖关系,并且可以在跨机器或者无网络的安全环境中保持代码的一致性。Yarn 提高了开发效率,并解决了共享代码时面临的一些问题,使得工程师们可以专注在构建新产品以及新特性上。
我们可以通过
npm install -g yarn
来安装yarn包管理器。
Phoenix + Yarn
Phoenix + Brunch + Yarn
mix phoenix.new pxyarn
这里是否install依赖我们选择no。
根据phoenix自动生成的带有brunch的package.json文件,根据这个文件使用yarn来进行npm模块的安装。
然后就是yarn登场啦!
➜ yarn install
yarn install v0.15.1
info No lockfile found.
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
[4/4] 📃 Building fresh packages...
success Saved lockfile.
✨ Done in 41.98s.
然后再安装剩余的 mix 扩展
mix deps.get
我们看一下空间占用:
对比 npm 的 phoenix 项目:
mix phoenix.new pxnpm
Fetch and install dependencies? [Yn] Y
在 Node 生态系统中,依赖通常安装在项目的 node_modules
文件夹中。然而,这个文件的结构和实际依赖树可能有所区别,因为重复的依赖可以合并到一起。npm 客户端把依赖安装到 node_modules 目录的过程具有不确定性。这意味着当依赖的安装顺序不同时,node_modules 目录的结构可能会发生变化。这种差异可能会导致类似“我的机子上可以运行,别的机子不行”的情况,并且通常要花费大量时间定位与解决。
Yarn 通过 lockfiles 文件以及一个确定性的、可靠的安装算法,解决了版本问题和 npm 的不确定性问题。Lockfile 文件把安装的软件包版本锁定在某个特定版本,并保证 node_modules 目录在所有机器上的安装结果都是相同的。Lockfile 还使用简洁的有序键名的格式,保证了每次的文件变化最小化,进行代码审查也更为简单。
Phoenix + Webpack + React + Yarn
使用Webpack之前,我们需要首先修改package.json
"dependencies": {
"react": "^15.4.0-rc.4",
"react-dom": "^15.3.2",
"react-router": "^2.8.1"
},
"devDependencies": {
"babel": "^6.5.2",
"babel-core": "^6.17.0",
"babel-loader": "^6.2.5",
"babel-preset-es2015": "^6.16.0",
"babel-preset-react": "^6.16.0",
"history": "^4.3.0",
"react-hot-loader": "^3.0.0-beta.6",
"webpack": "^1.13.2",
"webpack-dev-server": "^1.16.2"
},
yarn install
你也可以自行添加依赖,输入 yarn add xxx
即可。
yarn add react
yarn add webpack --dev
Refs
为什么我不使用 shrinkwrap(lock)
Facebook 发布了新的 Node 模块管理器 Yarn,或取代 npm 客户端
使用yarn 制作一个webpack + react 种子