如何开发自定义npx create-[项目名]-app命令实现项目脚手架生成

核心实现逻辑 #

你要开发的命令本质是一个可执行的npm包，只要包名符合create-*的命名规范，npx就可以直接识别执行，具体落地可以按以下步骤走：

1. 初始化项目包 #

首先新建你的开发目录，执行npm init -y初始化npm包，包名严格按照create-你的项目标识-app格式命名，比如你要做一个Vue3后台模板的脚手架，就叫create-vue3-admin-app。
在package.json里添加bin字段，指定命令的入口文件：

{
  "name": "create-vue3-admin-app",
  "version": "1.0.0",
  "bin": {
    "create-vue3-admin-app": "./index.js"
  }
}

在入口文件index.js的第一行加上#!/usr/bin/env node，声明这是node可执行脚本。

2. 编写核心功能逻辑 #

接收用户参数

可以直接通过process.argv获取用户输入的项目名等参数，要是需要更复杂的参数解析（比如支持--ts指定用TypeScript、--port指定端口），可以引入commander或者yargs第三方包简化开发。

生成预设项目结构

在你的包根目录新建template文件夹，把你要预置的所有项目文件（包括package.json、配置文件、src目录代码等）都放到这个文件夹里。
写逻辑递归拷贝template目录下的所有文件到用户指定的项目目录下，拷贝过程中可以做动态变量替换，比如把模板里package.json的name字段替换成用户输入的项目名，简单场景用字符串替换即可，复杂场景可以引入ejs等模板引擎实现。
注意要加判断逻辑，如果用户指定的项目目录已经存在，要提示用户确认是否覆盖，避免误删已有文件

自动安装依赖

文件拷贝完成后，用node内置的child_process.spawn方法，在生成的项目目录下执行npm install（也可以支持让用户选择yarn/pnpm作为包管理器），执行时把控制台输出重定向到用户终端，让用户能看到安装进度。

收尾提示

依赖安装完成后，输出提示信息，告诉用户接下来的启动命令，比如cd 项目名 && npm run dev即可启动项目。

3. 本地测试 #

在你的脚手架包根目录执行npm link，把本地包链接到全局npm依赖里，然后随便找个空白目录执行npx create-你的项目标识-app test-project，验证项目生成、依赖安装是否正常。

4. 发布使用 #

测试没问题后，执行npm publish把包发布到npm公共源或者公司私有源，之后所有用户都可以直接通过npx执行你的命令生成项目。

内容的提问来源于stack exchange，提问作者Moshe