当前位置：首页 > article >正文

Node脚本实现批量打包Vue项目(child_process子进程、window)

article 2024/10/10 1:01:44

前言

前几天用pnpm+workspace实现了monorepo，也就是单仓库多个项目，并且互相之间可能存在一定的联系。所以就存在一个打包的问题，也就是说，我想在打包某个特定子项目时，其他项目也执行build的命令。主要用到的是node的child_process子进程，话不多说，下面开始讲解，最后放出源代码。

第一步：创建&联系

创建顾名思义就是创建一个Js文件，js文件可以先cosole.log(1),并且用node test.js去测试一下。看能不能跑通
在这里插入图片描述
其中xx.js中的xx就是我们js的名称，如果能够正确打印，即可建立联系。
建立联系的方法也非常简单,找到我们当前项目的package.json,然后在script属性中定义一个新的属性,这里我定义的就是batch,这个属性值就是,node xx/js,如果js文件和package.json文件不是同级别的,比方说它是在同级test文件夹,那么我设定属性值为 node ./test/xx.js就ok了.

最后，在终端输入npm run batch.输出1，就成功了

第二步写node脚本

写这个脚本都需要用到哪些内容：
1.当前工作路径，便于后续更改工作路径。答案：const path = require(')
2.运行CMD命令的方法。答案：const { execSync } = require(‘child_process’);
3.修改工作路径的方法。答案：const process = require(‘process’)

首先先运行当前项目脚本

try {
    execSync('pnpm run build', { stdio: 'inherit' });
    console.log('出口项目构建成功');
} catch (error) {
    console.error('出口项目构建失败', error);
    return;
}

再运行其他项目，这里用到了path.join来拼接另一个项目的工作路径，再用process.chdir来更改工作路径。最后打包。

try {
    const targetDirectory = path.join(__dirname, '../', '../', '../', 'packages', 'miniProject');
    process.chdir(targetDirectory);
    execSync('pnpm run build', { stdio: 'inherit' });
    console.log('构建成功');
} catch (error) {
    console.error('构建失败', error);
    return;
}

最后就成功实现了。
https://nodejs.cn/api/process/process_chdir_directory.html
https://nodejs.cn/api/child_process.html#child_processexecsynccommand-options
https://nodejs.cn/api/path.html

console.log('测试是否成功启动')
try {
    execSync('pnpm run build', { stdio: 'inherit' });
    console.log('出口项目构建成功');
} catch (error) {
    console.error('出口项目构建失败', error);
    return;
}
try {
    const targetDirectory = path.join(__dirname, '../', '../', '../', 'packages', 'miniProject');
    process.chdir(targetDirectory);
    execSync('pnpm run build', { stdio: 'inherit' });
    console.log('构建成功');
} catch (error) {
    console.error('构建失败', error);
    return;
}