webpack复习

使用ProvidePlugin暴露对象到全局:

1
2
3
4
5
6
7
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery'
})
]

自定义require返回值:

1
2
3
4
5
6
7
8
// webpack.config.js

externals: {
'data': 'data data...'
}

// use in code
var data = require('data'); // 'data data...'

开启Hot Module Replacement(HMR)

方法一:

$ webpack --hot --inline
  • –hot: 添加HotModuleReplacementPlugin
  • –inline: 在生成的js中添加websocket客户端

方法二:

1
2
3
4
5
6
7
8
9
10
// webpack.config.js

entry: {
'webpack/hot/dev-server', // 仅仅是为window添加一个listener
'webpack-dev-server/client?http://localhost:8000' // websocket客户端
}

plugins: [
new webpack.HotModuleReplacementPlugin()
]
0%