前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >如何在启动Vue项目的同时跑 node.js脚本

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

原创
作者头像
PHP开发工程师
修改2021-07-29 17:58:14
2.3K0
修改2021-07-29 17:58:14
举报
文章被收录于专栏:thinkphp+vuethinkphp+vue

编写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 xxxnode 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

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 结语
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档