entry: {
'app': './src/main.js',
'service-worker': './src/service-worker.js'
},
output: {
path: config.build.assetsRoot,
filename: chunkData => {
return chunkData.chunk.name === 'service-worker'
? '[name].js'
: utils.assetsPath('js/[name].[chunkhash].js')
},
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
我还将服务工作者排除在HTML中:
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
excludeChunks: ['service-worker'],
}),
也有几种用法
CommonsChunkPlugin
当我第一次创建项目时,Vue CLI工具会自动设置:
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks (module) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity
}),
// This instance extracts shared chunks from code splitted chunks and bundles them
// in a separate chunk, similar to the vendor chunk
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
new webpack.optimize.CommonsChunkPlugin({
name: 'app',
async: 'vendor-async',
children: true,
minChunks: 3
}),
我遇到的问题是
service-worker.js
文件开头如下:
webpackJsonp([17],{"2xmR":function(e,n,_){"use strict";
var t,c,r,a,o,i;t="/path/to/src/service-worker.js",...
webpackJsonp
当浏览器尝试运行服务辅助进程时,函数不可用。
服务-工人.js
它有所有的依赖项(它们很少,我对重复的代码也没问题),没有任何Webpack实用程序。
CommonChunkPlugin插件
想要那些网站的公共块,只是不为服务人员。
我怎样才能开始构建我的一个入口点,它的所有依赖项都包含在文件中,而没有Webpack实用程序?