时间戳

首页 > 解决方案 > Webpack Laravel-Mix Chunk 错误类型错误：“e[r] 未定义”

laravel - Webpack Laravel-Mix Chunk 错误类型错误：“e[r] 未定义”

问题描述

我正在使用 Vue 和 Laravel 构建一个 Web 应用程序。我在后台使用 Laravel mix 和 Webpack 进行代码拆分和版本控制。

但是，每当我对我的代码进行更改时，运行 npm run production 并在实时服务器上上传，我经常收到 TypeError: "e[r] is undefined"

截屏

在页面正确加载之前，我必须手动清除浏览器缓存。我已经启用了版本控制，因此缓存清除应该是自动化的。

下面是我的 webpack.mix.js 文件

const mix = require('laravel-mix');
const webpack = require('webpack');
mix.webpackConfig({
    plugins: [
        new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
    ]
})
const CompressionPlugin = require('compression-webpack-plugin');

module.exports = {
    plugins: [new CompressionPlugin()],
    optimization: {
        minimize: true,
        namedModules: true,
        namedChunks: true,
        removeAvailableModules: true,
        flagIncludedChunks: true,
        occurrenceOrder: false,
        usedExports: true,
        concatenateModules: true,
        sideEffects: false, // <----- in prod defaults to true if left blank
    }
};

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/main/main.js', 'public/v1.4.0/js')
   .sass('resources/sass/app.scss', 'public/css')
    .extract(['vue'])
    .version();

标签： laravelwebpacklaravel-mix

解决方案

我有一个类似的问题，我找到了一个不太好的解决方案，但它有效：在 webpack 配置选项中设置optimization.concatenateModules并设置optimization.minimize为 false。

推荐阅读