从零开始写一个前端脚手架六、模板代码部署

我们在准备阶段就说过,最好准备一些模板代码.在脚手架生成的时候直接将其直接拿来用.

 

获取模板代码主要是两种方式:

1.内置在脚手架中,然后通过node file去操作,克隆文件.

    好处有:(1)我们可以在脚手架中内置多个模板,比如对应ts的代码模板,对应js的代码模板,对应不同用户权限的代码模板.不需要创建多个仓库

               (2)因为用一个项目代码去同时管理脚手架和模板,所以多方变更实际上只需要提交一次即可.

2.远端仓库

   好处有:(1)因为模板是和脚手架分开的,所以他们的各种更新互不干扰.单独更新即可.而且方便分开维护

               (2)选择性的拉取代码,而不是一次获得全部模板

 

暂时先用远端参数的方式来获取模板代码

首先:准备一个或者多个模板仓库,拿到其路径

然后:根据用户选择取拉取对应的仓库代码,因为是采取将路径用字符串写死在脚手架中的方式,所以我们需要用到准备阶段安装的child_process的exec去操作

const chalk =require('chalk')
const inquirer = require('inquirer')
const {exec } =require('child_process')
const promptList = [
    {
        type:'input',
        name:'projectName',
        message:'你的项目名称为',
        default:'sugar',
        validate:(value)=>{
            if(value===''){
                console.log(chalk.red.bold('无名氏'))
                return false
            }else{
                return true
            }
            
        }
    },
    {
        type:'input',
        name:'version',
        message:'你的项目版本号为',
        default:'1.1.0',
        when:(value)=>{
            if(value.projectName!=='sugar'){
                return true
            }else{
                return false
            }
        }
    },
    {
        type:'list',
        name:'type',
        message:'你想要创建哪种类型的项目',
        choices:[
         'ts',
         'js',
         'app'
        ],
    },
    {
        type:'password',
        name:'keyword',
        message:'项目的认证关键词是',
        prefix:'重要>>>>>',
        suffix:':'
    },
]

module.exports = ()=>{
    inquirer.prompt(promptList).then((answer)=>{
        console.log(chalk.green('开始初始化'))
        const gitUrl = {
            ts:'https//github.com/tsxxxxxx',  //ts模板对应的仓库路径
            js:'https//github.com/jsxxxxxx' //js模板对应的仓库路径
        }
        exec(`git clone ${gitUrl[answer.type]} ${answer.projectName}`,(err)=>{
            if(err){
             console.log(chalk.red('初始化出错啦'))
             process.exit()//退出当前操作
            }else{
             console.log(chalk.red('初始化完成'))
             process.exit()//退出当前操作
            }
         })
    })
    
}

 然后执行初始化命令,会在执行初始化命令的地方执行克隆命令.正常操作的情况下会拉一份仓库代码下来.

 

上一篇:从零开始写一个前端脚手架五、用户交互

下一篇:从零开始写一个前端脚手架七、定制化项目信息

上一篇:elementui样式引入方法


下一篇:LeetCode-225-用队列实现栈