问题

今天有个项目在打包的时候遇到了一个问题,就是执行 npm run build 命令的时候报错了,如下:

解决

我排查了一下,模拟代码如下:在打包的时候用了 MinChunkSizePlugin

const webpack = require("webpack");

module.exports = {

configureWebpack: (config) => {

if (process.env.NODE_ENV === "production") {

// 通过合并的方式处理 chunk,以减少请求数

config.plugins.push(

new webpack.optimize.MinChunkSizePlugin({

minChunkSize: 100 * 1024

})

);

}

}

};

并且路由用了懒加载,而且只有一个地方有懒加载的写法:

import Vue from "vue";

import Router from "vue-router";

import Home from "./views/Home.vue";

Vue.use(Router);

export default new Router({

routes: [

{

path: "/",

name: "home",

component: Home

},

{

path: "/about",

name: "about",

// route level code-splitting

// this generates a separate chunk (about.[hash].js) for this route

// which is lazy-loaded when the route is visited.

component: () => import(/* webpackChunkName: "about" */ "./views/About.vue")

}

]

});

这样就导致了报错,懒加载多的时候在开启,通过合并的方式处理 chunk,以减少请求数,一个的时候没必要。

文章来源

评论可见,请评论后查看内容,谢谢!!!评论后请刷新页面。