- Project is an old project of gulp + webpack
- start the development server and change the code. After saving, all files will be compiled, and those with no changes will also be compiled, resulting in slow compilation, which takes three minutes each time
webpack version 2.7.0
configure
const webpackConfig = {
devtool: devtool,
entry: entry,
output: {
filename: "js/[name].js",
path: path.join(process.cwd(), "dist", "assets"),
publicPath: publicPath,
chunkFilename: "js/ensure/[name]-[id]-[chunkhash].js",
libraryTarget: "umd"
},
resolve: {
modules: [
"node_modules",
path.join(rootDir, "src/")
],
alias: moduleConfig.alias
},
module: {
//
loaders: [{ test: /\.css$/, use: "happypack/loader?id=styles" },
{ test: /\.less$/, loader: "style-loader!css-loader!less-loader" }, {
test: /\.js$/,
exclude: /(node_modules)/,
use: "happypack/loader?id=js"
},
{
test: /\.vue$/,
loader: "happypack/loader?id=vue",
},
{ test: /\.(html|tpl)$/, loader: "art-template-loader" }
]
},
plugins: [
new HappyPack({
id: "js",
cache: true,
threadPool: HappyThreadPool,
loaders: [{
loader: "babel-loader",
options: {
presets: [
"stage-3"
],
plugins: ["syntax-dynamic-import"]
}
}],
}),
new HappyPack({
id: "styles",
cache: true,
threadPool: HappyThreadPool,
loaders: [{
loader: "style-loader!css-loader"
}],
}),
new HappyPack({
id: "tpl",
cache: true,
threadPool: HappyThreadPool,
loaders: [{
loader: "art-template-loader"
}],
}),
new HappyPack({
id: "vue",
loaders: [
{
loader: "vue-loader",
options: {
loaders: {
less: "vue-style-loader!css-loader!less-loader"
}
}
},
]
}),
new webpack.ProvidePlugin(moduleConfig.global),
new webpack.DefinePlugin({
"baseEnv": JSON.stringify(envConfig.baseEnv),
}),
new webpack.LoaderOptionsPlugin({
debug: true
}),
new HtmlWebpackPlugin({
filename: path.join(rootDir, "dist/index.html"),
template: path.join(rootDir, "src/modules/index.html"),
publicPath: config.dev.publicPath,
hash: true
}),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.HotModuleReplacementPlugin() //
],
};