模板结构主要包括四部分：preset.jsonprompts.jsgenerator/index.jstemplate/preset.jsonpreset.json是一个JSON对象，包含了创建新项目所需的预定义选项和插件，这样用户不需要在命令提示符中选择它们，称为预设；prompts.js交互通知vuecreate需要什么，是根据用户需求定制的信息。定义格式参考问询者问题格式数组（问询者官方文档）generator.jsgenerator.js导出一个函数，接收三个参数和一个GeneratorAPI实例，提供一系列API来控制最终输出的目录结构和内容自定义模板必须使用GeneratorAPI的render()方法用户自定义设置选项有：用户对prompts.js中问题提供的答案整个preset预设信息简单的自定义模板示例创建项目手动创建目录结构：|-vue-template|-generator|-index.js|-preset.json|-prompts.js获取preset.json模板首先使用vuecreate创建一个项目，然后保存你的预设信息，在指定目录下找到预设信息:#Unix~/.vuerc#windowsC://user/<用户名>/.vuerc{"useTaobaoRegistry":false,"latestVersion":"4.5.14","lastChecked":1634820758861,"packageManager":"npm"，“预设”：{“v2”：{“useConfigFiles":true,"plugins":{"@vue/cli-plugin-babel":{},"@vue/cli-plugin-typescript":{"classComponent":false,"useTsWithBabel":true},"@vue/cli-plugin-router":{"historyMode":false},"@vue/cli-plugin-vuex":{},"@vue/cli-plugin-eslint":{"config":"prettier","lintOn":["save","commit"]}},"vueVersion":"2","cssPreprocessor":"dart-sass"}}}其中presets保存预设信息，v2是保存预设的别名。我们的preset.json需要的是v2的值，所以preset.json里面的内容是这样的{"useConfigFiles":true,"plugins":{"@vue/cli-plugin-babel":{},"@vue/cli-plugin-typescript":{"classComponent":false,"useTsWithBabel":true},"@vue/cli-plugin-router":{"historyMode":false},"@vue/cli-plugin-vuex":{},"@vue/cli-plugin-eslint":{"config":"prettier","lintOn":["save","commit"]}},"vueVersion":"2","cssPreprocessor":"dart-sass"}创建问答prompts.jsmodule.exports=[]prompts.js我们不能提供问题，只是导出一个空数组；创建一个项目模板生成器#generator/index.jsmodule.exports=(api,options,rootOptions)=>{api.extendPackage({#extendpkg#scriptsscripts:{"serve":"vue-cli-serviceserve",“构建”：“vue-cli-服务构建”，“lint”：“vue-cli-servicelint"},#extendpkg#dependenciesdependencies:{"vue":"^2.6.11"},#extendpkg#devDependenciesdevDependencies:{"@babel/core":"^7.11.4","@babel/preset-env":"^7.11.0","@vue/cli-service":"~4.5.0","sass":"^1.26.10","sass-loader":"^8.0.2"}});#复制模板templateapi.render('../template');};如果私有依赖存储了configuration.vuerc，并且使用TaobaoRegistry=true，在创建项目时通过模板，会报找不到私有依赖，这就需要我们在创建项目前检查一下全局配置项varvuerc=shell.exec('vueconfig',{silent:true}).stdoutvardeleteConfigKey='useTaobaoRegistry'if(newRegExp(deleteConfigKey).test(vuerc)){shell.exec(`vueconfig--set${deleteConfigKey}false`,{silent:true})}child.execSync(`vuecreate--presetmulti-act--clone${projectName}`,{stdio:'inherit'});fs.ensureDirSync(`${projectName}/${Configure.BaseUri}`)Createatemplate最后，只需将项目模板复制到template并删除package.json文件。例如，对于以.开头的文件，更改为_。eslintrc.js=="_eslintrc.js。因为文件以.Git上传和拉取时将被忽略。默认模板结构如果项目中Vue-Cli默认模板文件比较多，可以使用如下方法删除默认模板//存放vue-cli3默认目录constdefaultDirs=[]api.render(files=>{object.keys(files).filter(path=>path.startsWith('src/')||path.startsWith('public/')).forEach(path=>{defaultDirs.push(path)删除文件[路径]})})api.render('../template')//删除vue-cli3的默认目录api.postProcessFiles(files=>{defaultDirs.forEach(path=>deletefiles[path])})调试使用vuecreate--preset
