节点脚本：使用 watchify 链接命令

Question

我正在使用 npm 脚本（请参阅下面我的 npm 文件）通过 watchify 监视文件的更改，然后编译并在编译后通知。然而，watchify 任务运行s（当第一个运行需要 40s）然后 notify:js 任务被立即调用。我希望在 watchify 完成编译后调用 notify:js。

{
  "dependencies": {
    "react": "^0.14.3",
    "react-dom": "^0.14.3"
  },
  "devDependencies": {
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "babelify": "^7.2.0",
    "browserify": "^12.0.1",
    "exorcist": "^0.4.0",
    "osx-notifier": "^0.2.2",
    "watchify": "^3.6.1"
  },
  "scripts": {
    "watch": "watchify src/app.js -o build/bundle.js -t [ babelify --presets [ es2015 react ] ] -dv | npm run notify:js",
    "compile:js": "browserify -e src/app.js -d -o build/bundle.js -t [ babelify --presets [ es2015 react ] ] -v",
    "notify:js": "osx-notifier --title 'JavaScript Compiled' --message 'JavaScript compiled to build/bundle.js' --type pass"
  }
}

我尝试了以下命令变体。

watchify src/app.js -o build/bundle.js -t [ babelify --presets [ es2015 react ] ] \
-dv & npm run notify:js

上述命令与 | 运算符的作用相同。

watchify src/app.js -o build/bundle.js -t [ babelify --presets [ es2015 react ] ] \
-dv && npm run notify:js

以上命令与 & 运算符的作用相同。

我在 watchify documentation 中看不到我想要实现的任何选项。我在这里遗漏了什么或者我尝试这样做的方式不可能吗？

Answer 1

我使用 nodemon and browserify-incremental 解决了这个问题。

这会将 JavaScript 编译成 bundle.js 文件。

browserifyinc -e resources/assets/js/app.js -o public/assets/js/bundle.js --cachefile .browserify-cache.json && npm run notify:js

这是我的 package.json 文件。

{
  "dependencies": {
    "react": "^0.14.3",
    "react-dom": "^0.14.3"
  },
  "devDependencies": {
    "babelify": "^6.1.3",
    "browserify": "^12.0.1",
    "browserify-incremental": "^3.0.1",
    "nodemon": "^1.3.8"
  },
  "browserify": {
    "transform": [
      "babelify"
    ]
  },
  "scripts": {
    "build": "npm run compile:js && npm run compile:sass",
    "watch": "npm run watch:js & npm run watch:sass",
    "notify:js": "osascript -e 'display notification \"JavaScript compiled to public/assets/js/bundle.js\" with title \"JavaScript Compiled\"'",
    "notify:sass": "osascript -e 'display notification \"CSS compiled to public/assets/js/app.js\" with title \"CSS Compiled\"'",
    "compile:js": "browserifyinc -e resources/assets/js/app.js -o public/assets/js/bundle.js --cachefile .browserify-cache.json && npm run notify:js",
    "compile:sass": "sass resources/assets/sass/app.scss:public/assets/css/app.css && npm run notify:sass",
    "watch:js": "nodemon --watch 'resources/assets/js' --exec 'npm run compile:js'",
    "watch:sass": "nodemon --watch 'resources/assets/sass' -e scss --exec 'npm run compile:sass'"
  }
}

节点脚本：使用 watchify 链接命令

Node Scripts: Chaining commands with watchify

node.js

browserify

watchify