开发一个适合小微前端团队的命令行工具（TypeScript + Etsc）

因卓诶原文链接

一个虚假的故事（狗头）

设想一下，如果10人以下的前端小团队要合作去协同一个项目;

这个时候leader说: “小明, 我们这次使用vue3吧，你去搭建一个项目吧！”

小明第一次开发vue3的项目，但是身为老司机却丝毫不慌，它按照官方文档一步一步的构建脚手架，去添加各种依赖，然后把之前vue2或者其他项目的公用代码复制过来。

1天过去了…

小红拿到了最新的脚手架代码，打开自己的webstorm；小蓝打开了自己的sublime；小紫打开了自己的vscode。数周之后，leader查看仓库，发现小红，小紫，小蓝的代码/架构风格迥异，而且代码毫无章法的蜷缩在仓库中，甚至出现了很多组件/公用方法重复的问题。几周之后慢慢迭代，慢慢地成为了“屎山”。当团队的人越来越多，这个代码可能就越“屎”。

---

前言

我从一毕业从事工作开始到今天，小团队接触的特别多，这种情况其实非常常见。但是由于时间和其他原因，一直没有机会把我开源项目的那一套技术栈搬过来；上周终于不是很忙就筹备了二个项目，用来解决小型团队的常见问题，成本不高，只需要一个包。在开始介绍之前，我们罗列一下问题列表:

1. 开发工具不统一
2. 代码规范以及美观性
3. 初始化一个项目做的准备工作太多
4. 技术迭代不够快

我们今天这篇文章主要讲述2个项目:

enjoy-project-tool仓库
enjoy-project-template仓库

命令行工具主要的作用就是拉取我们的代码模板，这个大家见怪不怪了，但是我仍需要描述一些细节给第一次做命令行的兄弟们看。至于项目模板，我开源的仓库的readme已经做了很多很多介绍以及使用方式，这里就不阐述过多了。

可以一边看完整代码，一边code

准备

使用nodejs开发命令行工具是对前端工程师最友好的方式，我们可以直接通过node去执行我们的js文件，所以我们随便npm init一个新的工程，然后更改我们的package.json

{
  "name": "enjoy-project-tool",
  "version": "1.0.0",
  "description": "",
  "main": "dist/main.js",
  "scripts": {
    "run": "nodemon",
    "lint": "eslint 'src/**/*' --fix",
    "prettier": "prettier --write '**/*.{ts,js,json,markdown}'",
    "lint-staged": "lint-staged",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "lint-staged": {
    "*.{ts,js,json,markdown}": [
      "prettier --write",
      "eslint --fix",
      "git add"
    ]
  },
  "bin": {
    "enjoy": "dist/main.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "chalk": "^4.1.2",
    "commander": "^8.1.0",
    "download-git-repo": "^3.0.2",
    "inquirer": "^8.1.2",
    "ora": "^5.4.1"
  },
  "devDependencies": {
    "@types/inquirer": "^7.3.3",
    "@types/node": "^16.7.10",
    "@typescript-eslint/eslint-plugin": "^4.30.0",
    "@typescript-eslint/parser": "^4.30.0",
    "esbuild-node-tsc": "^1.6.1",
    "eslint": "^7.32.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-prettier": "^4.0.0",
    "husky": "^7.0.2",
    "lint-staged": "^11.1.2",
    "nodemon": "^2.0.12",
    "prettier": "^2.3.2",
    "typescript": "^4.4.2"
  }
}

给大家描述一下，我们用什么技术栈去开发这个命令行工具？

首先我们需要typescript，使用esbuild-node-tsc（简称ETSC）去编译我们的ts代码；
其次我们使用husky和lint-staged以及eslint去对我们的代码做git提交之前的校验；
prettier主要做一个代码美化；
使用nodemon便于我们开发调试自动编译

如果你对上面的技术栈不是特别了解，没关系。我们再讲述具体实现的时候还会提到它们的。

开发命令行工具我们需要给node暴露一个js文件，那么这个文件我们可以存储dist目录下，并且我们需要描述一个名称&#x