react 自定义打包

12 篇文章 0 订阅
package.json中定义:
  "scripts": {
    "start": "node scripts/start.js",
    "serviceBuild": "node scripts/build.js",
    "test": "node scripts/test.js",
    "build": "node scripts/customBuild.js"
  },

customBuild.js:

/*
 * @Description: 自定义build执行逻辑
 * @Author: 边进锋
 * @Email: 18106763@cnsuning.com
 * @Date: 2020-07-28 16:27:40
 * @LastEditTime: 2020-09-27 15:10:59
 */

const path = require('path');
const fs = require('fs');
let copyPath = path.resolve(__dirname,'../build');//复制源的路径

/**
 * 从当前目录到复制到的目录的相对路径 
 * ※※※※ 每个项目自己都需要重新根据目录结构找到要打包复制的地址到该项目的相对路径 ※※※※
 */
const targetPath = '../../../'

const arguments = process.argv.splice(2);
/**
 * 需要打包到的三个目录名称
 */
const secendLevelDirectorys = ['olcs-bot-app-inner','olcs-bot-app-outer','olcs-bot-app-sop']
// 转化需要打包的三个目录的路径结果
const resolvedTargetPath = [] 
//转化路径
secendLevelDirectorys.forEach(item=>{
    const url = path.resolve(__dirname,`${targetPath}olcs/olcs-bot/${item}/src/main/resources/static`)
    resolvedTargetPath.push(url)
})
console.log(resolvedTargetPath)

const execGit = false;//是否执行git拉取代码,默认不执行

/** 删除指定文件,文件加
 *
 * @param {*} url
 */
const deleteFolderRecursive = (url)=> {
    console.log(`删除${url}路径操作`);
    let promise = new Promise((resolve,reject)=>{
        var files = [];
        /**
         * 判断给定的路径是否存在
         */
        if (fs.existsSync(url)) {
            /**
             * 返回文件和子目录的数组
             */
            if(!fs.statSync(url).isDirectory()){
                fs.unlinkSync(url);
                resolve();
                return;
            }
            files = fs.readdirSync(url);
            files.forEach(function (file, index) {
                var curPath = path.join(url, file);
                /**
                 * fs.statSync同步读取文件夹文件,如果是文件夹,在重复触发函数
                 */
                if (fs.statSync(curPath).isDirectory()) { // recurse
                    deleteFolderRecursive(curPath);

                } else {
                    fs.unlinkSync(curPath);
                }
            });
            /**
             * 清除文件夹
             */
            fs.rmdirSync(url);
            resolve();
        } else {
            console.log("给定的路径不存在,请给出正确的路径");
            resolve();
        }

    });
    return promise;
}

/**
 * cmd执行完成事件处理 复制build生成的index2和static2
 *@param {*} copySrc 复制路径
 *@param {*} targetSrc 需要复制到的目标目录
*/
//先递归遍历dist文件夹,把对应的文件或者文件夹写入目标路径
const traverseFolder = (copySrc,targetSrc)=>{
    let paths = fs.readdirSync(copySrc); //同步读取当前目录
    paths.forEach(function(path){
        var _src=copySrc+'/'+path;
        var _dst=targetSrc+'/'+path;
        fs.stat(_src,function(err,stats){ //stats  该对象 包含文件属性
            if(err)throw err;
            if(stats.isFile()){ //如果是个文件则拷贝 
                let readable=fs.createReadStream(_src);//创建读取流
                let writable=fs.createWriteStream(_dst);//创建写入流
                readable.pipe(writable);
            }else if(stats.isDirectory()){ //是目录则 递归 
                checkDirectory(_src,_dst,traverseFolder);
            }
        });
    });
}
/* 
 * 递归复制文件
*/
const checkDirectory = (src,dst,callback)=>{
    fs.access(dst, fs.constants.F_OK, (err) => {
        if(err){
            fs.mkdirSync(dst);
            callback(src,dst);
        }else{
            callback(src,dst);
        }
      });
};

/** 执行cmd命令 返回promise
 * 
 * @param {*} command 
 */
const execCmdCommand = (command)=>{
    console.log(new Date(),`执行cmd命令(${command})中...`);
    let promise = new Promise((resolve,reject)=>{
        const exec = require('child_process').exec;
        exec(command, (err, stdout, stderr) => {
            if (err){
                console.log('exec',err);
                console.warn(new Date(),`执行cmd命令(${command})命令失败`);
                reject();
            } else {
                console.log(stdout,stderr);
                console.log(new Date(),`执行cmd命令(${command})命令成功`);
                resolve();
            }
        });
    });
    return promise;
}

//执行git名称
const execGitCommand = (command)=>{
    console.log(new Date(),`执行git命令(${command})中...`);
    return execCmdCommand(command);
}

/* 新build执行方法
    先删除目标路径相关文件,然后执行cmd命令 npm run build  
    在执行完成事件中复制dist目录文件到webapp中
*/
const build = async (dirs) => {
    if(execGit){
        //先拉去最新代码
        console.log(new Date(),`git命令开始拉取代码`);
        let gitPull = `git pull`;
        await execGitCommand(gitPull);
        console.log(new Date(),`git命令拉取代码完成`);
    }

    if(arguments[0] != 'nobuild'){
        //运行打包命令 老的npm run  build 
        const cmdStr = 'npm run serviceBuild';
        console.log(new Date(),`开始打包...`);
        const start = new Date().getTime()
        await execCmdCommand(cmdStr);
        const end  = new Date().getTime()
        console.log(new Date(),`打包完成,耗时${end - start}ms`);
    }
    let promiseList = [];
    dirs.forEach(async dir=>{
        //递归删除文件夹下的所有文件
        console.log(new Date(),`开始删除${dir}目录内容`);
        const indexResult = deleteFolderRecursive(dir+'/index.html');
        const staticResult = deleteFolderRecursive(dir+'/static');
        promiseList.push(indexResult)
        promiseList.push(staticResult)
        await indexResult;
        await staticResult;
        console.log(new Date(),`删除${dir}目录成功!`);
        //复制dist文件到webapp
        console.log(new Date(),`文件往${dir}复制中...`);
        traverseFolder(copyPath,dir);
        console.log(new Date(),`文件往${dir}复制完成`);
    })
    await Promise.all(promiseList)
    console.log(new Date(),`打包完成!`);
}

build(resolvedTargetPath);


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值