使用`npm init initializer` 命令创建项目（译文）

历史上，npm init命令仅用于创建新的package.json文件。但是，从6.1.0版开始，您可以使用名为＜initializer＞的npm init的新特性。您提供的初始值设定项将决定如何构建新应用程序。npm将在＜initializer＞前面加上create-进行拼接，并使用npx临时安装和执行该项目。

3 ways to create-react-app with npm

根据你安装的不同版本的 npm , 交互npm包的方法也会有不同. 下面用create-react-app包来观察交互有何不同。

1. npm <= 5.1.0

如果使用 npm的早期版本 (小于等于 5.1.0), 在执行create-react-app命令时没有其他的选择.你必须全局安装 creat-react-app 并且使用它来构建你的app.

npm install create-react-app -g
create-react-app playground

你将从npm仓库中安装 create-react-app 并且使用这个全局包来构建你的app

优点

• 这个方法对于任何版的npm都可适用
• 一旦安装，后续无需再次安装

缺点

• 你安装的create-react-app版本可能会过时

2. npm >= 5.2.0

如果你的npm 版本大于等于5.2.0, 那你就可以使用由npm封装成的 npx 工具

npx (among other things) 当包不存在时会暂时性的全局下载. 这在你想尝试一个软件包，或者如果你不经常运行它并且想使用它的最新版本时非常有利。

npx create-react-app playground

上面这个命令将会从npm仓库暂时下载 create-react-app 然后执行它来构建你的app

优点

• 你总是可以使用最新的版本
• 你不需要全局安装资源包

缺点

• 不如使用已安装好的全局包那样快（每次都需要重新安装）

3. npm >= 6.1.0

最后, 如果你使用后续 npm版本 (6.1.0 或者之上), 那你便可以使用最新的方法构建app. The npm init 命令已经被使用了很多年, 但是在6.1.0 版本，增加了新的 <initializer> 方法 让 npm 知晓你将使用什么脚手架来构建你的app.

npm 将在你提供的初始项前拼接 create- 然后使用npx工具下载并执行它 (就像我们在上文提到的那样).

npm init react-app playground

上面的命令可以在npm仓库中找到 create-react-app 并且使用npx命令下载并执行它来构建你的app.

优点

• 可以让你语义化的初始项目
• 比你直接使用npx命令所需要的单词更短
• 你总是可以使用最新的包
• 你不需要全局的安装资源包（后面两条其实和npx一样了）

缺点

• 不如使用已安装好的全局包那样快（也和npx一样）

其他 create-<initializers>

在上面我们使用了create-react-app作为案例, 除此之外我们还有很多其他的脚手架可以使用, 例如...

• create-deck - Create mdx-deck presentations

  • npm init deck your-app-name

• create-component-app - Tool to generate different types of React components from the terminal. 💻

  • npm init component-app

• create-hintrc - 💡 A hinting engine for the web //webhint.io/

  • npm init hintrc

• create-esm - Create esm enabled packages

  • npm init esm

哪个是你最喜欢的脚手架呢? 如果你还用此方法处理过过其他的脚手架. 我很乐意知道（笔者: 现在vue3也可以用 npm init vite@latest 创建项目）请推特告诉我 @elijahmanor!

总结

根据你的 npm版本, 你可以使用不同的方法构建你的项目. 如果你拥有最新版本的npm, 你可以使用上述的三种方法, 包括最新的构造器选项.