vue-cli配置多入口程序

[phoebeCodeSpace]

vue-cli 生成文件

vue init webpack <project-name>

build/webpack.base.config.js

module.exports = {
  entry: {
    app: './src/main.js',
    admin: './src/main-admin.js'
  },
}

build/webpack.build.config.js

   new HtmlWebpackPlugin({
      filename: config.build.index,
      template: 'index.html',
      inject: true,
      chunks:['app'],  // 用chunks指定对应entry
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
        
      },
      chunksSortMode: 'dependency'
    }),
    new HtmlWebpackPlugin({
      filename: config.build.admin,
      template: 'index.html',
      inject: true,
      chunks: ['admin'],
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
      },
      chunksSortMode: 'dependency'
    }),

1. HtmlWebpackPlugin 配置必须用chunks指定entry对应的入口文件别名
2. 关于minify更多配置: https://github.com/kangax/html-minifier#options-quick-reference

build/dev-server.js

// app.use(require('connect-history-api-fallback')())
const history = require('connect-history-api-fallback');
app.use(history({
  rewrites:[
    {from:/^\/admin\/.*$/,to:'/admin.html'}
  ]
}))

将admin转发给admin.html