Webpack Plugins

webpack-hook-plugin v 1.0.7

这个插件允许你在webpack构建之前或之后运行shell命令。这将适用于webpack和webpack-dev-server。

非常适用于运行cron自动化任务、报告工具或诸如seleuium等测试。

安装

npm install --save-dev webpack-hook-plugin
1

设置

在webpack.config.js：

import WebpackHookPlugin from 'webpack-hook-plugin';

module.exports = {
  //...
  //...
  plugins: [
    new WebpackHookPlugin({
      onBuildStart:['echo "Webpack Start"'],
      onBuildEnd:['echo "Webpack End"']
    })
  ],
  //...
}
1
2
3
4
5
6
7
8
9
10
11
12
13

示例

插入你的webpack.config.js：

import WebpackHookPlugin from 'webpack-hook-plugin';
const path = require('path');

var plugins = [];

plugins.push(new WebpackHookPlugin({
  onBuildStart: ['echo "Starting"'],
  onBuildEnd: ['python script.py && node script.js']
}));

var config = {
  entry: {
    app: path.resolve(__dirname, 'src/app.js')
  },
  output: {
    path: path.resolve(__dirname, 'dist'), // 常规 webpack
    filename: 'bundle.js'
  },
  devServer: {
    contentBase: path.resolve(__dirname, 'src') // dev server
  },
  plugins: plugins,
  module: {
    loaders: [
      {test: /\.js$/, loaders: 'babel'},
      {test: /\.scss$/, loader: 'style!css!scss?'},
      {test: /\.html$/, loader: 'html-loader'}
    ]
  }
}

module.exports = config;
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

构建完成后会生成一个子进程同时出发 python 和 node 脚本。

API

名称 默认值 作用
onBuildStart [ ] 在出事构建中执行的脚本数组。
onBuildEnd [ ] 在编译结束时派发文件后执行的脚本数组。
onBuildExit [ ] webpack进程完成后要执行的脚本数组。注意：这个事件也会在webpack完成包更新时在webpack --watch中触发。
onCompile [ ] 每次编译时执行的脚本数组。
dev true 切换到开发环境。这将让脚本执行一次。对于在webpack-dev-server或webpack watch 模式上运行HMR很有用。
safe false 将脚本执行过程从生成切换(spawn)到执行(exec)。如果在生成中遇到问题，打开这个设置。

← build-hash-webpack-plugin →