如何在启动Vue项目的同时跑 node.js脚本

编写copyFile.js 脚本实现,将文件夹内所有文件和子文件夹拷贝到另外的文件夹中

注意 copyFile.js 属于后端脚本,需要执行 node copyFile.js 运行

引入node环境中自带的两个模块 写文件模块和读文件模块

const fs = require(‘fs’);
const path = require(‘path’);
复制代码
以下两段代码是一个整体 :使用方法是直接调用 copyFolde(源文件相对路径,复制目标的相对路径) 函数

将源文件拷贝到目标文件:

//!将srcPath路径的文件复制到tarPath cd为回调
var copyFile = function(srcPath, tarPath, cb) {
var rs = fs.createReadStream(srcPath);
rs.on(‘error’, function(err) {
if (err) {
console.log(‘read error’, srcPath);
}
cb && cb(err);
})

var ws = fs.createWriteStream(tarPath);
ws.on(‘error’, function(err) {
if (err) {
console.log(‘write error’, tarPath);
}
cb && cb(err);
})
ws.on(‘close’, function(ex) {
cb && cb(ex);
})

rs.pipe(ws);
}

复制代码
将源文件夹下所有的文件和子文件夹,拷贝到目标文件夹下

//! 将srcDir文件下的文件、文件夹递归的复制到tarDir下 cd为回调
var copyFolder = function(srcDir, tarDir, cb) {
fs.readdir(srcDir, function(err, files) {
var count = 0;
var checkEnd = function() {
++count == files.length && cb && cb();
}

if (err) {
  checkEnd();
  return;
}

files.forEach(function(file) {
  var srcPath = path.join(srcDir, file);
  var tarPath = path.join(tarDir, file);

  fs.stat(srcPath, function(err, stats) {
    if (stats.isDirectory()) {
      console.log('mkdir', tarPath);
      fs.mkdir(tarPath, function(err) {
        if (err) {
          console.log(err);
          return;
        }

        copyFolder(srcPath, tarPath, checkEnd);
      });
    } else {
      copyFile(srcPath, tarPath, checkEnd);
    }
  });
});

//为空时直接回调
files.length === 0 && cb && cb();

});
}

复制代码
copyFile.js是基于node.js编写的后端脚本,哪问题来了,如何将后端脚本在Vue项目中运行,众所周知在Vue中启动项目是执行 npm run xxx 而copyFile.js的命令是 node copyFile.js

方案一:在同一个项目中打开两个命令行窗口 分别执行 npm run xxx 和 node copyFile.js 效果作用在同一个项目中
打开两个窗口又是执行两个命令,方案一太麻烦了。有没有什么方法只需要执行 npm run xxx 命令 便可达到方案一的效果

npm run xxx:会执行pakeage.json中在scripts中写的脚本命令,这些脚本就是node_modules/.bin中的文件名

方案二:设置启动多条命令 在package.json文件中配置

如果命令中包括空格,则需要使用()将命令包含起来。此外&&与&的作用也不同。

“scripts”: {
“serve”: “(node copyFile.js) && (vue-cli-service serve)”,
“start”: “webpack & (ng serve)”
},
复制代码
➊ 命令先后顺利执行。先执行node copyFile.js,该命令执行完毕后再执行vue-cli-service serve
➋ 命令一并执行。同时执行webpack以及ng serve两个命令

结语
创作不易,如果对大家有所帮助,希望大家点赞支持,有什么问题也可以在评论区里讨论😄~

如果你觉得这篇文章对你有点用的话,麻烦请给我们的开源项目点点star: http://github.crmeb.net/u/defu 不胜感激 !

来自 “开源独尊 ” ,链接:https://ym.baisou.ltd/post/825.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CRMEB定制开发

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值