webpack配置多页面

配置打包多页面

var glob = require('glob') // 页面打包模块
var HtmlWebpackPlugin = require('html-webpack-plugin') // 生成多个html
var path = require('')
// html-webpack-plugin基本的配置参数
const htmlDeploy = {
  inject: true, // 是否将源文件插入底部
  hash: true, // 是否带上hash值
  cache: true, // 是否只打包文件变化部分
  template: 'path', // 项目依赖的模板文件地址
}
const traverse = () => {
  let entrys = {} // webpack配置的项目入口
  let htmlPlugins = [], // 多页面的入口地址
  let entrysPath = glob.sync(path.resolve(__dirname, 'src')) // 项目的入口路径
  if (!entrysPath.length) return
  for (let entry of entrysPath) {
    const item = path.parse()
    const entryName = item.dir.substring(item.dir.lastIndexOf('/') + 1)
    const entryPath = item.dir + '/' + item.base
    entrys[entryName] = entryPath
    htmlPlugins.push(new HtmlWebpackPlugin(Object.assign(htmlDeploy, {
      filename: path.resolve(__dirname, '../dist') + '/' + entryName + '/index.html', // filename可以指定打包出去的路径
      chunks: [entryName]
    }))
  }
  return {
    entrys,
    htmlPlugins
  }
}