03.脚手架开发的本地调试技巧

758 阅读2分钟

我们在开发脚手架的时候, 当然不可能每次修改一点内容就发布到npm然后再从npm安装到本地再进行调试对吧, 所以, 本地调试就显得特别重要, 那今天我们就来看看脚手架开发过程中怎么进行本地调试吧

初始化项目

我们新建一个文件夹命名为scaffold, 然后我们在scaffold里面新两个字文件夹

  • arcjs作为我们主包
  • arcjs-lib作为分包 现在我们要在arcjs-lib包未发布的时候就可以被arcjs主包进行引入使用, 我们应该怎么做呢?

文件结构及内容

. ├── arcjs │ ├── index.js │ └── package.json └── arcjs-lib ├── index.js └── package.json

arcjs包下的index.js
```js
#! /usr/bin/env node
const lib = require("arcjs-lib");

console.log("This log is from local arcjs package!");
console.log("sum ===> ", lib.sum(1, 2));

arcjs包下的package.json, 其他的不重要, 但是一定要指定bin字段, 这个为我们在安装arcjs命令到全局的时候要用到的

{
  ...
  "bin": {
    "arcjs": "index.js"
  },
  ···
}

arcjs-lib 包下的index.js, 这里我们导出一个sum方法, 以供arcjs包调用

module.exports = {
  sum: (a, b) => a + b,
};

arcjs-lib包下的package.json, 这里要指定main字段, 因为当我们从其他包引入这个包的时候, main指定的文件是作为入口文件被引入的

{
  ...
  "main": "index.js"
  ···
}

实现流程

  • cdarcjs-lib包中, 执行npm linkarcjs-lib包链接到全局
  • cdarcjs包中, 执行npm link arcjs-lib, 这个时候我们会看到node_modules下面会多出一个arcjs-lib的文件夹, 而其实这个文件夹是指向 -> ../../arcjs-lib的, 所以我们在arcjs-lib文件夹中做的任何修改, 都会立即生效
  • arcjs再执行npm linkarcjs找那个package.json中bin字段指定的arcjs命令安装到全局

测试

任意目录下输入arcjs就会看到

➜  arcjs arcjs
This log is from local arcjs package1!
sum ===>  3

而且我们在arcjs-lib下做的任何修改, 在arcjs中都是立即生效的, 因为我们使用的是一个软连接

这就是本地调试脚手架的全部内容了, 以下还有几个小补充:

  • 我们在执行npm link arcjs-lib的时候, arcjs-lib并不会加入我们的dependencies里面去, 所以我们需要手动写入, 以便我们在脚手架正式上线的时候能正常安装到对应的依赖
  • 通过process.argv可以拿到命令行的参数, index为0和1为系统相关的东西, 用户输入的在index为2以后

好啦, 今天的分享就到这里啦, 明天开始我们开始看一个脚手架项目管理工具lerna