脚手架开发流程
开发流程
1.创建 npm 项目
2.创建脚手架入口文件,最上方添加:
#!/usr/bin/env node
3.配置 package.json ,添加 bin 属性
4.编写脚手架代码
5.将脚手架发布到 npm
使用流程
1.安装脚手架
npm install -g your-cli
2.使用脚手架
your-cli
脚手架开发难点解析
分包:将复杂的系统拆分成若干个模块
命令注册
vue create vue add ...
参数解析
vue command [options] <params>
还有其他:
命令行交互
日志打印
命令行文字变色
网络通信
文件处理
动手写一个简单的脚手架
创建 文件夹 & 初始化 npm 项目
mkdir cli-test cd cli-test npm init -y
在 根目录 创建 bin/index.js,并在inde.js中 指明 node 环境
#!/usr/bin/env node
console.log('cli test')
3.在package.json中 指定 脚手架名称 和入口文件
"bin": {
"cli-test": "bin/index.js"
},
4.登录 npm 并发布
5.在终端安装并使用 脚手架
本地调试方法
1.npm link。就是创建软连接
2.在脚手架 上级目录,全局安装后,进行调试。
多个包如何调试?
1.创建两个包,分别是 cli-test 和 cli-test-lib
2.在cli-test-lib,执行npm link
3.进入 cli-test,执行 npm link cli-test-lib 此时就可以在cli-test中使用cli-test-lib了。
4.在 cli-test-lib 中 lib/index.js写个方法
module.exports = {
sum(a,b){
return a+b;
}
}
5.在cli-test中引入 cli-test-lib方法
#!/usr/bin/env node
const lib = require('cli-test-lib');
console.log(lib.sum(1,2))
console.log('cli test')
6.在终端直接执行 cli-test。可以看到执行效果。
脚手架本地link标准流程
链接本地脚手架
cd your-cli-dir
npm link
链接本地库文件
cd your-lib-dir
npm link
cd your-cli-dir
npm link your-lib
取消本地链接脚手架
cd your-lib-dir
npm unlink
cd your-cli-dir
# link存在
npm unlink your-lib
# link不存在
rm -rf node_modules
npm install -S your-lib
理解npm link:
1.npm link your-lib :将当前项目中 node_modules 下指定的库文件链接到 node 全局 node_modules 下的库文件
2.npm link :将当前项目链接到 node 全局 node_modules 中作为一个库文件,并解析 bin 配置创建可执行文件
理解 npm unlink:
1.npm unlink:将当前项目从 node 全局 node_modules 移除
2.npm unlink your-lib :将当前项目中的库文件依赖移除
脚手架命令注册和参数解析
实现注册一个命令:curry-cli-test init
1.首先在 cli-test-lib 项目下 定义一个 init 方法
module.exports = {
init(){
console.log('执行init流程')
}
}
2.在 cli-test 中 注册 init 命令
#!/usr/bin/env node
const lib = require('cli-test-lib');
// 注册一个命令 curry-cli-test init
const argv = require('process').argv;
const command = argv[2];
console.log(command)
if(command){
if(lib[command]){
lib[command]();
}else{
console.log('无效的命令')
}
}else{
console.log('请输入命令')
}
3.现在在终端输入 curry-cli-test init
4.在终端输入 curry-cli-test publish
5.在终端输入 curry-cli-test
原生脚手架开发痛点分析
痛点一:重复操作
1.多package本地link
2.多package依赖安装
3.多package单元测试
4.多package代码提交
5.多package代码发布
痛点二:版本一致性
1.发布时版本一致性
2.发布后相互依赖版本升级
登录 npm 并发布
结论:package越多,管理复杂度越高
lerna开发脚手架流程