2. 前端脚手架开发流程

创建脚手架

1. 创建一个 npm 项目

mkdir web-frontend-cli
cd web-frontend-cli
npm init -y

2. 创建 bin 文件夹，并在文件夹中创建入口文件

#!/usr/bin/env node
console.log('脚手架')

3. 在 package.json 中指定入口文件

{
  "name": "web-frontend-cli",
  "version": "1.0.0",
  "description": "",
  "bin": {
    "web-starter": "bin/index.js"
  },
  "main": "index.js",
  "keywords": [],
  "author": "",
  "license": "ISC"
}

4. npm 发包

npm login
npm publish

使用流程

1. 全局安装脚手架

npm i web-frontend-cli -g

2. 测试脚手架，执行 frame-start

~ % web-starter
'脚手架打印的内容'

3. 可以查询 web-starter 的安装路径

~ % which web-starter
/node/v22.19.0/bin/web-starter

~ % ls -l /usr/local/bin/frame-start
lrwxr-xr-x@ 1 XXX staff  49 12 13 17:42 /Users/XXX/.nvm/versions/node/v22.19.0/bin/web-starter -> ../lib/node_modules/web-frontend-cli/bin/index.js