一、entry & output
mode: 'development',
// entry: './src/index',
// entry: ['./src/index', './src/pollyfill'],
entry: {
app: './src/index',
pollyfill: './src/pollyfill.js'
},
output: {
filename: '[name].[hash:8].js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/',
},
二、resolve
resolve: {
extensions: ['.js', '.jsx', '.json'],
alias: {
'@': path.join(__dirname, '../', 'src'),
}
},
三、懒加载
import() 原理是通过jsonp; 返回promise
const $el = document.createElement('div');
$el.className ='container';
$el.addEventListener('click', function(){
import('./caltTest').then((res)=>{
console.log(res.default);
})
});
document.body.appendChild($el);
四、热更新
devServer中增加hotOnly:true
五、定义环境变量
new Webpack.DefinePlugin({
ENV: 'true',
// SERVE: "'https://www.baidu.com'",
UAT: JSON.stringify('uat'),
}),