vuecli3 执行 npm run build 打包命令报错:TypeError: file.split is not a function

问题

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

解决

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

js 复制代码
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
                })
            );
        }
    }
};

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

js 复制代码
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,以减少请求数,一个的时候没必要。

相关推荐
知识分享小能手17 小时前
微信小程序入门学习教程,从入门到精通,自定义组件与第三方 UI 组件库(以 Vant Weapp 为例) (16)
前端·学习·ui·微信小程序·小程序·vue·编程
瓯雅爱分享2 天前
Java+Vue构建的采购招投标一体化管理系统,集成招标计划、投标审核、在线竞价、中标公示及合同跟踪功能,附完整源码,助力企业实现采购全流程自动化与规范化
java·mysql·vue·软件工程·源代码管理
苏打水com3 天前
前端框架深度解析:Vue 从入门到实战,掌握渐进式开发核心
vue
棋子一名3 天前
跑马灯组件 Vue2/Vue3/uni-app/微信小程序
微信小程序·小程序·uni-app·vue·js
苏打水com3 天前
前端框架深度解析:Vue.js 3 从 Composition API 到生态升级,解锁企业级开发新能力
vue
知识分享小能手4 天前
微信小程序入门学习教程,从入门到精通,微信小程序核心 API 详解与案例(13)
前端·javascript·学习·react.js·微信小程序·小程序·vue
小灰灰的可爱无人可替代4 天前
记录一次使用docker和docker-compose更新vue前端项目问题
nginx·docker·vue
java水泥工5 天前
酒店客房管理系统|基于SpringBoot和Vue的酒店客房管理系统(源码+数据库+文档)
spring boot·vue·酒店管理系统·酒店客房管理系统
爱看书的小沐6 天前
【小沐学WebGIS】基于Three.JS绘制飞行轨迹Flight Tracker(Three.JS/ vue / react / WebGL)
javascript·vue·webgl·three.js·航班·航迹·飞行轨迹
知识分享小能手7 天前
微信小程序入门学习教程,从入门到精通,WXS语法详解(10)
前端·javascript·学习·微信小程序·小程序·vue·团队开发