前端工程(react,vue)每次打包递增版本号

实现改功能需要引入4个必要模块

  1. child_process(node 自带)
  2. readline(node 自带)
  3. cross-env(npm 上下载)
  4. fs-jetpack(npm 上下载)

在项目根目录下新建文件src/assets/version.json

{
          
   
  "devVersion": "1.0.1",  // 开发环境版本号
  "testVersion": "1.0.2", // 测试环境版本号
  "proVersion": "1.0.3"  // 生产环境版本号
}

根目录下新建文件app_build.js用于执行打包命令

const PROCESS = require(child_process);
const READ_LINE = require(readline);
const JET_PACK = require(fs-jetpack);

// 创建一个readline的interface实例
const readline = READ_LINE.createInterface({
          
   
    input: process.stdin, // 要监听的可读流。 此选项是必需的。
    output: process.stdout // 要将逐行读取的数据写入的可写流
})

// 获取对应环境的app_version
const getAppVersionByEnv = async (env = dev) => {
          
   
    const willUpdate = await isUpdate()
    const dataJson = JET_PACK.read(./src/assets/version.json);
    if (dataJson) {
          
   
        // 获取现在的版本号,然后将选择环境的版本号加1
        let nowVersion = JSON.parse(dataJson)[env + Version];
        console.log(`获取当前${
            
     env}环境的版本号: ${
            
     nowVersion}`)
        let newVersion = Number(nowVersion.split(.).join())
        if (willUpdate) {
          
   
            newVersion += 1;
            newVersion = String(newVersion).split().join(.);
            const envData = JSON.parse(dataJson);
            envData[env + Version] = newVersion;
            JET_PACK.writeAsync(./src/assets/version.json, JSON.stringify(envData))
        }else{
          
   
            newVersion = String(newVersion).split().join(.);
        }
        console.log(`本次打包${
            
     env}环境的版本号: ${
            
     newVersion}`);
        return newVersion
    }
    return 1.0.0
}


// 获取是否要升级版本Y->升级N->不升级
const isUpdate = () => {
          
   
    return new Promise((resolve) => {
          
   
        readline.question(是否要升级本次版本?(Y/N) 默认Y: , (update = Y) => {
          
   
            if (update === Y) {
          
   
                resolve(true)
            } else {
          
   
                resolve(false)
            }
        })
    })
}

// 获取用户要打包输入的类型dev/test/pro
const getBuildEnv = () => {
          
   
    return new Promise((resolve, reject) => {
          
   
        const envList = [dev, test, pro];
        readline.question(请选择要打包的环境dev/test/pro 默认dev: , (envType) => {
          
   
            if (envList.includes(envType)) {
          
   
                resolve(envType)
            } else {
          
   
                console.log(获取对应环境的失败~)
                reject(env error)
            }
        })
    })
}

// 执行cmd命令,打包构建
const runCmd = (cmd) => {
          
   
    // 使用给定的 command 和 args 中的命令行参数衍生新进程。 如果省略,args 默认为空数组
    const ls = PROCESS.spawn(cmd, {
          
    shell: true });

    ls.stdout.on(data, (data) => {
          
   
        let msg = data.toString();
        console.log(msg);
    });

    ls.stderr.on(data, (data) => {
          
   
        console.log(data.toString())
    });

    ls.on(close, (code) => {
          
   
        console.log(code);
    });
}

// 主函数
const main = async () => {
          
   
    const env = await getBuildEnv();
    if (env) {
          
   
       await getAppVersionByEnv(env);
        runCmd(`cross-env UMI_ENV=${
            
     env} cross-env APP_TYPE=true umi build`) // react指令
        // runCmd(`cross-env VUE_APP_ISAPP=true vue-cli-service serve --mode ${env}`) // vue指令
    }
    readline.close()
}

main()

package.json新增node指令

"build:app": "node ./app_build.js"
经验分享 程序员 微信小程序 职场和发展