zoukankan      html  css  js  c++  java
  • webpack多页面打包笔记

    依赖glob库
    前提:统一放在src目录下,然后放功能名目录,最后放index.js
    格式
    entry: glob.sync(path.join(__dirname, './src/*/index.js))

     
    webpack.config.js的内容
    const path = require('path')
    const glob = require('glob')
    const HtmlWebapckPlugin = require('html-webpack-plugin')

    const setMPA = () => {
    const entry = {}
    const htmlWebapckPlugins = []
    const entryFiles = glob.sync(path.join(__dirname, './src/*/index.js'))
    Object.keys(entryFiles)
    .map(index => {
    const entryFile = entryFiles[index]
    const match = entryFile.match(/src/(.*)/index.js/)
    const pageName = match && match[1]
    entry[pageName] = entryFile
    htmlWebapckPlugins.push(
    new HtmlWebapckPlugin({
    template: path.join(__dirname, `src/${pageName}/index.html`),
    filename: `${pageName}.html`,
    chunks: `${pageName}`,
    inject: true,
    minify: {
    html5: true,
    collapseWhitespace: true,
    preserveLineBreaks: false,
    minnifyCSS: true,
    minifyJS: true,
    removeComments: false
    }
    })
    )
    })

    return {
    entry,
    htmlWebapckPlugins
    }
    }

    const {entry, htmlWebapckPlugins} = setMPA()

    module.exports = {
    entry: entry,
    output: {
    filename: '[name]_[chunkhash:8].js',
    path: path.join(__dirname, 'dist')
    },
    mode: 'production',
    plugins: htmlWebapckPlugins
    }

  • 相关阅读:
    小技巧:通过linux一行命令修改ip
    小技巧:textarea文本输入区内实现换行
    set 排序实例
    每日日报
    每日日报
    每日日报
    每日日报
    每日日报
    每日日报
    每日日报
  • 原文地址:https://www.cnblogs.com/victory820/p/12364207.html
Copyright © 2011-2022 走看看