3

背景

我目前有一个 npm 脚本，看起来像

"dev":"yarn install && concurrently -k \"npm run webpack\" \"cd dist/ && node App.js\" \"npm run test\" \"npm run lint\""

从逻辑上讲，这会并行运行 webpack、启动应用程序、lints 和测试。

该脚本中的 npm webpack 具有 --watch 集

注意：这是给开发者的。

问题

  • 这会尝试在 webpacked 之前运行应用程序
  • 当 webpack 由于 watch 重新打包时，这不会重新运行应用程序

目标

  • 运行npm run webpack一次
  • 当它输出时（意味着手表被触发并完成）运行其他三个命令
  • 当发生崩溃通知我时，不要浪费时间运行不起作用的东西，而是在我修复文件时再试一次。

真正的问题

我不知道我不知道什么。我怀疑真正的答案可能在 webpack 配置本身中，或者有一个比并发/监视我的用例更好的工具，或者关于我如何设计它的核心思想简直太疯狂了。也许我想创建一个使用 webpack 开发中间件来提供这些服务的 devServer.js？那将如何进行 linting 和测试呢？

我不知道这个版本的漂亮版本会是什么样子。

我真正需要的

关于“应该”如何进行的精彩教程/指南/博客文章。

4

1 回答 1

1

这就是我要做的；也许有更好的方法：

"scripts": {
  "dev": "yarn install && concurrently -k \"npm run webpack\" \"npm run watch\"",
  "watch": "onchange \"dist/**/" -- concurrently -k \"cd dist/ && node App.js\" \"npm run test\" \"npm run lint\""
}

这使用onchange。npm run dev并行启动 webpack 和 onchange。onchange 监视任何文件更改dist/并在任何文件更改时运行您的任务。

这种方法的局限性在于您的任务将在文件更改为dist. dist/您可以通过在运行 webpack 之前删除来解决此问题。（使用rimraf以跨平台方式执行此操作。）示例：

"dev": "yarn install && rimraf dist && concurrently -k \"npm run webpack\" \"npm run watch\""

rm -rf dist如果您不关心 Windows 支持，则可以使用。

于 2017-04-04T16:45:45.113 回答