新建项目

这个没什么好说的哈, 直接看命令

➜  Desktop mkdir arc
➜  Desktop cd arc
➜  arc npm init -y
Wrote to /Users/felixhi/Desktop/arc/package.json:

{
  "name": "arc",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

➜  arc code .

命令行登录npm

输入npm login按照提示进行登录, 登出命令为npm logout, 如果不确定是否已经登录, 可以使用npm whoami进行检查

脚手架开发

登录好了以后我们回到项目, 新建一个index.js文件

键入以下内容

#!/usr/bin/env node
console.log("This log is from arcf package");

然后在package.json中配置bin字段, 字段的key是需要软链的命令名称, value是需要执行的文件

{
  "name": "arcf",
  ...
  "bin": {
    "arcf": "index.js"
  },
 ...
}

以上为例, arcf就是我们可以执行的命令, index.js就是执行这条命令会运行的文件

现在的目录结构是这样子的

就两个文件, 简单吧？

➜  arc tree
.
├── index.js
└── package.json

0 directories, 2 files

发布脚手架

执行npm publish进行发布, 这里可能会遇到403错误, 遇到这个错误大概率是你的包名和别人的包名冲突了, 修改package.json中的name字段修改包名再次尝试即可大致执行过程差不多是这样子的

➜  arc npm publish
npm notice 
npm notice 📦  arcf@1.0.7
npm notice === Tarball Contents === 
npm notice 72B  index.js    
npm notice 257B package.json
npm notice === Tarball Details === 
npm notice name:          arcf                                    
npm notice version:       1.0.7                                   
npm notice filename:      arcf-1.0.7.tgz                          
npm notice package size:  335 B                                   
npm notice unpacked size: 329 B                                   
npm notice shasum:        ff222978cb918c8f0e16905cda33bc059d3f7d68
npm notice integrity:     sha512-WrSXKTYkdyr+G[...]PBHKJIdjo9fbQ==
npm notice total files:   2                                       
npm notice 
npm notice Publishing to https://registry.npmjs.org/
+ arcf@1.0.7

发布成功以后我们就可以在本地安装它啦

本地安装

/opt/homebrew/lib/node_modules/arcf
➜  arcf git:(stable) npm install -g arcf 

changed 1 package, and audited 2 packages in 2s

found 0 vulnerabilities

运行脚手架

安装好以后我们的电脑上就有arcf命令啦(这个是我们在package.json中配置的), 直接运行它

➜  arcf arcf
This log is from arcf package!nice!

Nice! 到这里我们整个脚手架的整个发布流程就算跑通啦, 当然这只是脚手架开发的的冰山一角, 参数解析、多package调试, 命令行交互等我们将在后续的文章中一一进行探索

好啦, 今天的分享就到这里啦, 明天我们开始来研究怎么在本地调试我们的脚手架, 以及多package的时候怎么在本地引入其他未发布的package进行调试

02.从一个"Hello world"版的脚手架开始了解脚手架的发布流程