npm run build 时出现语法报错 Module parse failed: Unexpected token

错误原因

出现这个错误一般是你使用了或者引用的包里出现了ES6的语法,但是你的webpack可能是4.x或者更低版本的,

这时候单靠webpack本身无法识别ES6的语法,但是升级webpack到5可能会与现有的代码产生兼容性问题,因此就需要引入babel插件,将ES6的语法进行转换。

常见ES6语法有 ??、??=、?.、?: 等等。

Module parse failed: Unexpected token (46:45)
You may need an appropriate loader to handle this file type,currently no loaders are configured to process this file

引入插件

执行一下三个命令,注意如果出错,请去npm官网找到最高的兼容webpack4的版本安装即可。

npm install @babel/core
npm install babel-loader@8.3.0
npm install @babel/preset-env

配置babel-loader

在webpack.base.conf.js中添加如下内容

{test: /\.js$/,use: {loader: 'babel-loader',options: {// 使用 Babel 中的 @babel/preset-env 预设presets: ['@babel/preset-env',]}}}

在这里插入图片描述

结果

此时重新 npm run build 应该就好了,但是请注意,为了保险点,最好手动把之前的dist目录删除,避免缓存问题导致build后运行还是出错。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/9911.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

服务器内存占用不足会怎么样,解决方案

在当今数据驱动的时代,服务器对于我们的工作和生活起着举足轻重的作用。而在众多影响服务器性能的关键因素当中,内存扮演着极其重要的角色。 服务器内存,也称RAM(Random Access Memory),是服务器核心硬件部…

回炉重造java----双列集合(HashMap,TreeMap)

体系结构 ①基本操作: ②遍历方式: 第一种: 键找值&#xff0c;通过map.keySet()获取Map的键集合&#xff0c;通过键去匹配Map中的值 Set<String> strings map.keySet();for (String string : strings) {System.out.println(map.get(string));} 第二种: 键值对&…

【linux】vmtouch文件缓存管理工具

目录 vmtouch简介 用法 例子 统计文件或者目录在缓存中的记录 缓存文件到内存 其他类似工具 vmtouch简介 vmtouch是用c语言编写的文件缓存管理工具&#xff0c;适用用于所有类Unix系统。 作用&#xff1a; 1&#xff0c;查看文件系统缓存情况 2&#xff0c;将文件或目…

多个.C文件被编译为一个可执行文件的详细过程

多个.C文件被编译为一个可执行文件的详细过程 文章目录 多个.C文件被编译为一个可执行文件的详细过程前言一、一个.C文件的编译过程二、多个.C文件的链接过程1.文件信息2.链接过程3.makefile 总结 前言 C语言经典的 “hello world ” 程序从编写、编译到运行&#xff0c;看到屏…

【Qt 学习笔记】Qt常用控件 | 多元素控件 | List Widget的说明及介绍

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;Qt 专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ Qt常用控件 | 多元素控件 | List Widget的说明及介绍 文章编号&#x…

线性表

1.1线性表的定义 线性表&#xff1a;零个或多个数据元素的有限序列。 注&#xff1a; &#xff08;1&#xff09;它是一个序列。元素之间是有顺序的&#xff0c;若元素存在多个&#xff0c;则第一个元素无前驱&#xff0c;最后一个元素无后继&#xff0c;其他元素有且只有一个…

dragonbones 5.6.3不能导出的解决办法

问题描述 使用dragonbones 5.6.3导出资源时无反应。 解决方法 第一步安装node.js&#xff0c;我这里使用的是V18.16.0第二步进入到DragonBonesPro\egretlauncher\server\win目录&#xff0c;然后把里面的node.exe替换为刚刚下载的node文件夹即可&#xff0c;如下图&#xff…

FonePaw Data Recovery for Mac:轻松恢复丢失数据

FonePaw Data Recovery for Mac是一款功能强大的数据恢复软件&#xff0c;专为Mac用户设计&#xff0c;帮助用户轻松恢复因各种原因丢失的数据。该软件支持从硬盘驱动器、存储卡、闪存驱动器等存储介质中恢复丢失或删除的文件&#xff0c;包括照片、视频、文档、电子邮件、音频…

[windows系统安装/重装系统][step-3]装驱动、打驱动、系统激活

重装系统三部曲 [windows系统安装/重装系统][step-1]U盘启动盘制作&#xff0c;微软官方纯净系统镜像下载-CSDN博客 [windows系统安装/重装系统][step-2]BIOS设置UEFI引导、磁盘分区GPT分区、安装系统[含完整操作拍照图片]-CSDN博客 [windows系统安装/重装系统][step-3]装驱动…

数据分析:基于sparcc的co-occurrence网络

介绍 Sparcc是基于16s或metagenomics数据等计算组成数据之间关联关系的算法。通常使用count matrix数据。 安装Sparcc软件 git clone gitgithub.com:JCSzamosi/SparCC3.git export PATH/path/SparCC3:$PATHwhich SparCC.py导入数据 注&#xff1a;使用rarefy抽平的count ma…

web安全之登录框渗透骚姿势,新思路

不管漏洞挖掘还是挖SRC&#xff0c;登录框都是重点关注对象&#xff0c;什么漏洞都有可能出现&#xff0c; 本篇文章做个总结&#xff0c;后面发现新思路后会继续更新 万能密码 or 弱口令 SQL注入 水平越权 垂直越权 逻辑漏洞 短信轰炸 邮箱轰炸 信息泄露 验证码DOS XSS万能密…

Redis数据结构-Dict

1.3 Redis数据结构-Dict 我们知道Redis是一个键值型&#xff08;Key-Value Pair&#xff09;的数据库&#xff0c;我们可以根据键实现快速的增删改查。而键与值的映射关系正是通过Dict来实现的。 Dict由三部分组成&#xff0c;分别是&#xff1a;哈希表&#xff08;DictHashTa…

一文读懂Vue生命周期(Vue2)

一文读懂Vue生命周期&#xff08;Vue2&#xff09; 目录 一文读懂Vue生命周期&#xff08;Vue2&#xff09;1 前言2 Vue生命周期2.1 基本生命周期2.1.1 8个生命周期2.1.2 案例 2.2 组件生命周期2.2.1 父子生命周期2.2.2 案例 2.3 keep-alive生命周期2.3.1 案例 2.4 其他 3 总结…

安装ESXI 7.0的系统盘小于120G,安装后无本地datastore存储的处理办法

1、应用场景 在全新安装ESXI 7.0后&#xff0c;系统将会划分120G空间作为虚拟闪存&#xff0c;在大容量硬盘的设备中&#xff0c;120G无足轻重&#xff0c;但是当ESXI系统盘容量非常小的时候会导致无可用本地存储空间。 我这里的情况就是服务器里内置了2个120G的硬盘&#xff…

Java找不到包解决方案

在跟着教程写Spingboot后端项目时&#xff0c;为了加快效率&#xff0c;有时候有的实体文件可以直接粘贴到目录中&#xff0c;此时运行项目会出现Java找不到包的情况&#xff0c;即无法找到导入的实体文件&#xff0c;这是项目没有更新的原因。解决方法&#xff1a; 刷新Maven:…

《Python编程从入门到实践》day24

# 昨日知识点学习 创建外星人从一个到一行 # 主程序snipdef _create_fleet(self):"""创建外星人群"""# 创建一个外星人并计算一行可容纳多少个外星人# 外星人的间距为外星人的宽度alien Alien(self)alien_width alien.rect.widthavailable_sp…

大模型常用微调数据集

文章目录 指令微调数据集人类对齐数据集 为了增强模型的任务解决能力&#xff0c;大语言模型在预训练之后需要进行适应性微调&#xff0c;通常涉及两个主要步骤&#xff0c;即指令微调&#xff08;有监督微调&#xff09;和对齐微调。 指令微调数据集 在预训练之后&#xff0c…

动手学深度学习——多层感知机

1. 感知机 感知机本质上是一个二分类问题。给定输入x、权重w、偏置b&#xff0c;感知机输出&#xff1a; 以猫和狗的分类问题为例&#xff0c;它本质上就是找到下面这条黑色的分割线&#xff0c;使得所有的猫和狗都能被正确的分类。 与线性回归和softmax的不同点&#xff1…

Ubuntu/Linux 安装Docker + PyTorch

文章目录 1. 提前准备2. 安装Docker2.1. 卸载冲突软件&#xff08;非必要&#xff09;2.2. 在Ubuntu系统上添加Docker的官方GPG密钥2.3. 将Docker的仓库添加到Ubuntu系统的APT源列表中2.4. 安装最新Docker2.5. 检查 3. 安装Nvidia Container Toolkit3.1. 在Ubuntu系统上添加官方…

求一个B站屏蔽竖屏视频的脚本

求一个B站屏蔽竖屏视频的脚本 现在B站竖屏竖屏越来越多了&#xff0c;手机还好点给我一个按钮&#xff0c;选择不喜欢&#xff0c;但是我一般都用网页版看视屏&#xff0c;网页版不给我选择不喜欢的按钮&#xff0c;目测大概1/4到1/3的视频都是竖屏视频。 目前网页版唯一的进…