webpack3升级到4出现了很多问题,经过验证报错信息如下

1

Module parse failed: Unexpected token (:)
You may need an appropriate loader to handle this file type.
| //Vue.use(Router)
| var Login = function Login() {
> return import( /* webpackChunkName: "login-group"*/'../components/LoginComponent/Login');
| };

此原因是webpack版本过高导致,package.json中配置的

"webpack": "^4.1.1",安装的时候会自动安装成最新的4.32.*,我们把之前安装的卸载掉安装固定的版本4.1.1,package.json中配置:
"webpack": "4.1.1"//可以固定版本
2
Module build failed (from ./node_modules/vue-loader/index.js):
TypeError: Cannot read property 'vue' of undefined
at Object.module.exports (D:\aat\node_modules\vue-loader\lib\loader.js::) @ ./src/main.js :- :-
@ multi babel-polyfill ./src/main.js

这个原因是由于vue-loader版本造成的,将13.7.2升级成14.*,我这里是14.2.2,配置成固定的版本:

"vue-loader": "^14.2.2",

所以上术两个错误:将webpack版本降到4.1.1,vue-loader升级成14.*就可以解决

注意:webpack4要全局安装webpack-cli   npm install webpack-cli -g

看似简单是小问题导致我找了一天多,真尴尬,现在发出来希望大家少走弯路
												

webpack升级4出现的问题的更多相关文章

  1. 基于vue2.x的webpack升级与项目搭建指南--基础篇

    first thing fitrst 博主声明:绝对不当标题党 有人看最好不过的背景: 十月初对公司产品的前端构建做了一些优化,但还遗留了不少问题(可了解我的前一篇博文:一次webpack小规模优化经 ...

  2. Webpack + Vue 多页面项目升级 Webpack 4 以及打包优化

    0. 前言 早在 2016 年我就发布过一篇关于在多页面下使用 Webpack + Vue 的配置的文章,当时也是我在做自己一个个人项目时遇到的配置问题,想到别人也可能遇到跟我同样的问题,就把配置的思 ...

  3. webpack 3.1 升级webpack 4.0

    webpack 3.1 升级webpack 4.0 为了提升打包速度以及跟上主流技术步伐,前段时间把项目的webpack 升级到4.0版本以上 webpack 官网:https://webpack.j ...

  4. webpack4升级指南

    webpack4升级指南 鉴于图书项目编译速度极慢的情况(项目里面module太多了,编译慢很正常)且最近需求不多(很少出现的空挡期).所以我觉得搞一波webpack升级,看看有没有帮助.webpac ...

  5. npm run dev--The 'mode' option has not been set, webpack will fallback to 'production' for this value

    npm run dev时报警告: warning configurationThe 'mode' option has not been set, webpack will fallback to ' ...

  6. webpack踩坑--webpack 2.x升级至4.x

    一.安装webpack-cli,webpack@4.26.1 1.npm install webpack-cli -D 2.npm install webpack@4.26.1 -D 二.踩坑 执行n ...

  7. webpack的build的时候时间长处理方案

    观察第一次build的时间比较长,之后的编译时间较短,可以通过webpack -watch 监测性能 1, 将webpack升级到4.0,build 的速度提升很多 2,用webpack -watch ...

  8. webpack 使用 extract-text-webpack-plugin 报错 Tapable.plugin is deprecated. Use new API on .hooks instead

    webpack 使用 extract-text-webpack-plugin 报错 Tapable.plugin is deprecated. Use new API on .hooks instea ...

  9. webpack的一些坑

    最近自己着手做一个小的Demo需要webpack,目前版本号是4.41.2,想使用的版本是3.6.0,因3x版本和4x版本很多地方不同,所以在安装过程中也是很多坎坷,下面是遇到的一些坑,和一些解决办法 ...

随机推荐

  1. python用cx_Oracle连接oracle

    确认版本: oracle版本:64位 python版本:64位 下载cx_Oracle的whl包:64位 安装whl包:pip install wheel cd到下载路径安装cx_Oracle的whl ...

  2. ping指定IP的指定端口号

    ping是简单的测试网络连接情况的小工具,对于一般用户很实用,但是ping有个缺点就是,不能指定端口 tcping命令是针对tcp监控的,也可以看到ping值,即使源地址禁ping也可以通过tcpin ...

  3. Linux系统管理_主题02 :管好文件(1)_2.4 链接文件_ln

    在 Linux 中,链接有两种:符号链接(symbolic link)和硬链接(hard link).  删除一个符号链接不会影响到这个符号链接指向的目标文件或目 录:  反过来,删除.移动或者重 ...

  4. 为lumen添加session支持

    为lumen添加session支持,同时配置全局函数csrf_token可用 首先laravel和lumen框架的版本要一致,我这里版本都是5.4 1.复制laravel框架config目录下的ses ...

  5. 字符串写入到json文件

    背景: PHP产生公告 ,发送到CGI ,在CGI把该公告的json 字符串写入到文件内(转义后的字符串) 通过 jsoncpp 操作 int write_notice_to_json(string ...

  6. VS Code中内置终端运行C中文乱码问题

    环境:Win10 + VS Code + Code Runner插件 原因:VS Code默认文件编码为 UTF-8,生成的可执行文件也是UTF-8编码的,但是系统编码为 GB2312,所以程序中的中 ...

  7. Python3 Selenium自动化web测试 ==> 第九节 WebDriver高级应用 -- 操作select 和 alert

    学习目的: 掌握页面常规元素的定位方法 场景: 网页正常的select元素下拉框常规方法和select专属方法 正式步骤: step1:常规思路select页面元素定位 处理HTML代码截图 # -* ...

  8. Docker踩坑小记

    Docker是一个开放平台用于快速开发.分发和部署应用程序.   Docker是一种容器管理技术.   解决头疼问题原则:回归最简单的方式来.确保最初级的方案没有错误. 安装 docker安装很简单, ...

  9. Android ConstraintLayout 说明和例子

    快速说明 当我们点击一个按钮时,显示效果如下 Baseline的显示需要右键该控件,然后 约束类型 尺寸约束 实心方块,用来调整组件的大小 边界约束 空心圆圈,建立组件之间,组件和parent的约束关 ...

  10. RTSP协议概况

    RTSP协议概况 简单的交互命令就能实现RTSP对接,C代表Client S代表Server 例如:C1-客户端发的第一个命令 S1-服务器响应的第一个回复 [C1]OPTIONS rtsp://10 ...