守候你守候我
可以直接在vue.config.js 中 设置 pages属性来做到// vue.config.jsmodule.exports = {
pages: { index: { // 入口js的路径
entry: './src/views/index/entry', // 页面模板路径
template: `./src/views/index/index.html`
}
}
}pages 可以遍历获得在 @vue/cli-service/lib/config/app.js 中有下面一段，里面已经考虑了多页的情况// @vue/cli-service/lib/config/app.js...const multiPageConfig = options.pages
...if (!multiPageConfig) { // default, single page setup.
......
} else { // multi-page setup
webpackConfig.entryPoints.clear() const pages = Object.keys(multiPageConfig)
pages.forEach(name => { const {
entry,
template = `public/${name}.html`,
filename = `${name}.html`
} = multiPageConfig[name] // inject entry
webpackConfig.entry(name).add(api.resolve(entry)) // inject html plugin for the page
const pageHtmlOptions = Object.assign({}, htmlOptions, {
chunks: ['chunk-vendors', 'chunk-common', name],
template: fs.existsSync(template) ? template : defaultHtmlPath,
filename
})
webpackConfig
.plugin(`html-${name}`)
.use(HTMLPlugin, [pageHtmlOptions])
})
pages.forEach(name => { const { filename = `${name}.html` } = multiPageConfig[name]
webpackConfig
.plugin(`preload-${name}`)
.use(PreloadPlugin, [{
rel: 'preload',
includeHtmlNames: [filename],
include: { type: 'initial',
entries: [name]
},
fileBlacklist: [/\.map$/, /hot-update\.js$/]
}])
webpackConfig
.plugin(`prefetch-${name}`)
.use(PreloadPlugin, [{
rel: 'prefetch',
includeHtmlNames: [filename],
include: { type: 'asyncChunks',
entries: [name]
}
}])
})
}