vue-cli 3.0 多页面 怎么配置？

Question

版本: @vue/cli-service": "^3.0.0-beta.6

配置了chaiWebpack,但configureWebpack不知道怎么配置，求指点~~

vue.config.js 如下：

module.exports = {
  lintOnSave: false,
  chainWebpack: config => {    config
      .entry('one')
      .add('./src/pages/one/one.ts')
      .end()
      .entry('two')
      .add('./src/pages/two/two.ts')
      .end()
  },
  configureWebpack: config => {    if (process.env.NODE_ENV === 'production') {      // mutate config for production...
    } else {      // mutate for development...
    }
  }
}

Answer 1

可以直接在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]           }         }])   }) }

Answer 2

// vue.config.jsmodule.exports = { pages: {index: {  // entry for the page   entry: 'src/main.js',  // the source template   template: 'public/index.html',  // output as dist/index.html   filename: 'index.html'},shareback: {  entry: 'src/shareback.js',  template: 'public/shareback.html',  filename: 'shareback.html'},}}