devtool
1棺滞、源碼映射會單獨生成一個sourcemap文件纷铣，出錯了會標(biāo)識當(dāng)前出錯的列和行
devtool: 'source-map' // 增加映射文件可以幫助我們調(diào)試代碼
2、不會產(chǎn)生單獨的文件贡避，但是可以顯示行和列
devtool: 'eval-source-map'
3痛黎、不會產(chǎn)生列，但是是一個單獨的映射文件
devtool: 'cheap-module-source-map' // 產(chǎn)生后你可以保留起來
4刮吧、不會產(chǎn)生文件湖饱，集成在把包后的文件中，不會產(chǎn)生列
devtool: 'cheap-module-eval-source-map'
watch
watch: true,
watchOptions: { // 監(jiān)控的選項
poll: 1000, // 每秒
aggregateTimeout: 500, //防抖
ignoned: /node_modules/ // 不需要進(jìn)行監(jiān)控的文件
}
Plugin
1杀捻、cleanWebpackPlugin 清除歷史dist文件插件
let HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
plugins: [
new CleanWebpackPlugin('./dist')
]
}
注意：現(xiàn)在這個插件清空地址取決于webpack的output中的path
2井厌、copyWebpackPlugin 拷貝插件
let CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = {
plugins: [
new CopyWebpackPlugin([
{from: 'doc', to: './'} // doc 文件里面的文件夾拷貝到dist文件夾
])
]
}
3、bannerPlugin 版權(quán)聲明插件（內(nèi)置）
let webpack = require('webpack');
module.exports = {
plugins: [
new webpack.BannerPlugin('make 2019 by myzony@qq.com')
]
}
resolve 解析第三方包
module.exports = {
resolve: {
modules: [path.resolve('node_modules')],
extensions: ['.js', '.css', '.json', '.vue'],
mainFields: ['style', 'main'],
mainFiles: [], // 入口文件的名字致讥，默認(rèn)index.js
alias: { // 別名 vue vue.runtime
bootstrap: 'bootstrap/dist/css/bootstrap.css'
}
}
}
