Question

写一个自己的vue-cli脚手架

Answer 1

目前在市面上存在很多脚手架，如：create-react-app、vue-cli。我们可以通过一行简单的命令，就能创建一个基本的项目工程，大大地提高了开发效率。但是我们会面临一个问题，除了脚手架帮我们创建好的项目框架，我们的项目总有需要定制化的配置，比如我们需要引入我们想要的elementUI框架，引入axios相关的工具类完成http请求等。我们不可能每次开启新项目都再配置一遍吧，这太劳神费力了。

通常我们会搞一个个性化脚手架cli，平时创建项目时通过该脚手架一键生成，并同时完成所有需要的配置，以快速开发。接下来，我们看看怎么搞？

如果要暴露一个全局的命令，首先需要在 package.json 文件中编写一个 bin 命令，当前示例指向bin目录下的mycli.js文件。

读取命令行参数其实非常简单，使用 program.argv 获取

根据用户的选择，创建不同类型的项目模板，比如是否要typescript支持

一般我们会事先准备好一个项目模板，供cli下载

3.1 引入所需依赖

3.2创建cli版本和用法命令

3.3 从项目模板地址，下载到本地

我们这里使用了工具类download-git-repo的download方法，大家可以查下相关API

3.4项目下载完成后，依据用户输入，变更项目名和版本号

基于bin 命令的配置，将我们的包映射到全局，这样就可以通过运行模块名来运行我们的模块，这跟linux上建立一个软链接差不多，以方便我们在本地测试。

想要获取脚手架mycli源码，私信我mycli即可。