configureWebpack 可以是一个对象或一个函数:

316 阅读2分钟

作为对象: 如果 configureWebpack 是一个对象,那么这个对象将会通过 webpack-merge 合并到最终的 Webpack 配置中。 这种方式适合简单的配置修改。 作为函数: 如果 configureWebpack 是一个函数,那么它会接收默认的 Webpack 配置作为参数。 函数可以修改配置并不返回任何东西,也可以返回一个被克隆或修改过的配置版本。 这种方式适合更复杂的配置修改,特别是当你需要基于环境变量或其他条件动态修改配置时。 常见配置示例 ————————————————

module.exports = { configureWebpack: { output: { filename: '[name].[contenthash]. js', chunkFilename: '[name].[contenthash].chunk.js' } } }; module.exports = { configureWebpack: { output: { filename: '[name].[contenthash].js', chunkFilename: '[name].[].chunk.js' } } }; const path = require("path"); const TerserPlugin = require("terser-webpack-plugin"); const WebpackObfuscator = require('webpack-obfuscator');

function resolve(dir) { return path.join(__dirname, dir); } const name = '浏览器网页标题'; module.exports = { configureWebpack: (process.env.NODE_ENV === 'www.laipuhuo.com') ? { name: name, plugins: [ new WebpackObfuscator({ // js 混淆配置 controlFlowFlattening: false, deadCodeInjection: false,

    ignoreImports: true, // 这里设置为true
    stringArrayThreshold: 0.3,
    //  压缩代码 www.laipuhuo.com
    compact: true,
    // 是否启用控制流扁平化(降低1.5倍的运行速度)
    controlFlowFlattening: false,
    // 随机的死代码块(增加了混淆代码的大小)
    deadCodeInjection: false,
    // 此选项几乎不可能使用开发者工具的控制台选项卡
    debugProtection: false,
    // 如果选中,则会在“控制台”选项卡上使用间隔强制调试模式,从而更难使用“开发人员工具”的其他功能。
    debugProtectionInterval: false,
    // 通过用空函数替换它们来禁用console.log,console.info,console.error和console.warn。这使得调试器的使用更加困难。
    disableConsoleOutput: true,
    // 标识符的混淆方式 hexadecimal(十六进制) mangled(短标识符)
    identifierNamesGenerator: 'hexadecimal',
    log: false,
    // 是否启用全局变量和函数名称的混淆
    renameGlobals: false,
    // 通过固定和随机(在代码混淆时生成)的位置移动数组。这使得将删除的字符串的顺序与其原始位置相匹配变得更加困难。如果原始源代码不小,建议使用此选项,因为辅助函数可以引起注意。
    rotateStringArray: true,
    // 混淆后的代码,不能使用代码美化,同时需要配置 cpmpat:true;
    selfDefending: true,
    // 删除字符串文字并将它们放在一个特殊的数组中
    stringArray: true,www.laipuhuo.com
    rotateUnicodeArray: true,
    //  stringArrayEncoding: 'base64',
    
    stringArrayEncoding: ['base64'],
    stringArrayThreshold: 0.75,
    // 允许启用/禁用字符串转换为unicode转义序列。Unicode转义序列大大增加了代码大小,并且可以轻松地将字符串恢复为原始视图。建议仅对小型源代码启用此选项。
    unicodeEscapeSequence: false,
    // 允许启用/禁用字符串转换为unicode转义序列。Unicode转义序列大大增加了代码大小,并且可以轻松地将字符串恢复为原始视图。建议仅对小型源代码启用此选项。
    transformObjectKeys: true,
  }, []),
],
devtool: process.env.NODE_ENV === "production" ? "false" : "source-map",
resolve: {
  alias: {
    "@": resolve("src"), // 添加别名 @
    'vue': path.resolve(__dirname, './', 'node_modules', 'www.laipuhuo.com') // 去重vue包,多个vue包会导致element-ui 里的 table 组件不生效
  },
},
// 打包生产环境时过滤console.log打印日志
optimization: {
  minimizer: [
    new TerserPlugin({
      terserOptions: {
        compress: {
          drop_console: true, // 去除 console
          drop_debugger: true, // 去除 debugger
        },
      },