webpackd打包两次-生成两份代码-出现legacy的js文件

当我们build后dist文件中出现legacy的js文件。

原因:
pack.json文件;

{
*****"browserslist": ["> 0.03%","not dead"]
}
  • 当我们项目运行在古老的浏览器上面时(表示支持市场份额超过 > 0.03% 的浏览器版本),甚至在初始的webpack下都不满足旧版浏览器的兼容,webpack5为我们提供了browserslist配置来轻松构建较为健全的兼容Polyfills的转化。自动二次打包出兼容的文件代码。关于以上配置可查看往期文章 vue-cli5.0.x优雅降级,配置项目兼容旧版浏览器
  • 所以有了以上配置。但是更随而来的代价便是有了二次构建打包出兼容性更好的egacy的js文件其实最直观的感受就是打包的速度变慢了
  • 同时这也是vue-cli现代模式正常生产build下的产物vue-cli现代模式,可以通过改变构建命令来规避(跳过)这个为兼容而二次打包的过程。(不是最佳解决方案

在这里插入图片描述

在这里插入图片描述


解决方案

一 、反正就是为了兼容的不要把browserslist配置的太离谱即可

"dependencies" : {},
"devDependencies": {},
"browserslist": ["> 1%","last 2 versions","not dead","not ie 11"
]

二、手动规避:不需要 type=“module”
2.1 可以yarn build --no-module
yarn build --no-module说明打包之后,不生成<script type="module">

npx vue-cli-service help build可以查看 build 后面可添加的指令

Usage: vue-cli-service build [options] [entry|pattern]Options:--mode         specify env mode (default: production)--dest         specify output directory (default: dist)--no-module    build app without generating <script type="module"> chunks for modern browsers--target       app | lib | wc | wc-async (default: app)--inline-vue   include the Vue module in the final bundle of library or web component target--formats      list of output formats for library builds (default: commonjs,umd,umd-min)--name         name for lib or web-component mode (default: "name" in package.json or entry filename)--filename     file name for output, only usable for 'lib' target (default: value of --name)--no-clean     do not remove the dist directory contents before building the project  --report       generate report.html to help analyze bundle content--report-json  generate report.json to help analyze bundle content--skip-plugins comma-separated list of plugin names to skip for this run--watch        watch for changes--stdin        close when stdin ends
使用:vue-cli-service build [options] [entry|pattern]选项:——mode指定env模式(默认为production)
——dest指定输出目录(默认:dist)
——no-module不生成&lt;script type="module"&gt;现代浏览器的块
——target app | lib | wc | wc-async(默认:app)
——inline-vue将Vue模块包含在库或web组件目标的最终包中
——格式化库构建的输出格式列表(默认:commonjs,umd,umd-min)
——name lib或web组件模式的名称(默认:package. name)。Json或条目文件名)
——filename用于输出的文件名,仅用于'lib'目标(默认:——name的值)
——no-clean在构建项目之前不要删除dist目录的内容
生成report.html来帮助分析包的内容
——report-json生成报告Json来帮助分析包的内容
——skip-plugins用逗号分隔的要跳过的插件名称列表
——注意观察变化
——stdin结束时关闭

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

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

相关文章

PPSSPPSDL for Mac v1.17.1 PSP游戏模拟器(附500款游戏) 激活版

PPSSPPSDL for Mac是一款模拟器软件&#xff0c;它允许用户在Mac上运行PSP&#xff08;PlayStation Portable&#xff09;游戏。通过这款模拟器&#xff0c;用户可以体验到高清甚至更高的分辨率的游戏画面&#xff0c;同时还能够升级纹理以提升清晰度&#xff0c;并启用后处理着…

vite和webpacke的常规配置

文章目录 1、vite和webpacke的区分2、vite的常规配置介绍主要部分介绍vite基本配置示例 3、webpacke的常规配置介绍主要部分介绍Webpack 基本配置示例 1、vite和webpacke的区分 相同点&#xff1a; 都是构建工具&#xff0c;用于资源打包 &#xff1b; 都有应用到摇树原理 tre…

[Diffusion Model 笔记]DDIM 笔记 数学推导 Denoising Diffusion Implicit Models

目录 核心总结符号定义第一套&#xff0c;快速简单讲清采样方法继续分析&#xff0c;待定系数法求解图示理解关于参数sigma 本文是观看以下视频的笔记&#xff0c;强烈推荐观看最后的图示理解&#xff1a; https://www.bilibili.com/video/BV13P411J7dm/?spm_id_from333.788 论…

路由重分布的概念与配置

路由重分布的概念 l 路由重分布是指连接不同路由域&#xff08;自治系统&#xff09;的边界路由器&#xff0c;它在路由协议之间交换和通告路由信息 从一种协议&#xff08;含静态/直连路由&#xff09;到另一种协议 同一种协议的多个实例 路由重分布的背景 网络出口位置…

时间序列预测:基于PyTorch框架的循环神经网络(RNN)实现销量预测

之前随手一写&#xff0c;没想到做预测的同学还挺多&#xff0c;但是之前那个效果并不好&#xff0c;于是在之前的基础上重新修改完善&#xff0c;到了现在这一步才感觉预测算是初步能应用。 上文地址&#xff1a;LSTM模型预测时间序列&#xff1a;根据历史销量数据预测商品未…

AI预测福彩3D第9套算法实战化测试第4弹2024年4月26日第4次测试

今天继续进行新算法的测试&#xff0c;今天是第4次测试。好了&#xff0c;废话不多说了&#xff0c;直接上图上结果。 2024年4月26日福彩3D预测结果 6码定位方案如下&#xff1a; 百位&#xff1a;4、5、7、8、3、9 十位&#xff1a;6、9、5、4、1、2 个位&#xff1a;7、8、5、…

光明的未来:光分路器在现代通信中的角色

光分路器又叫分光器&#xff0c;是一种集成波导光功率分配器件&#xff0c;作用是实现光信号的分路。例如&#xff0c;一个1x4光分路器可以将一路输入光信号等比分成四路输出光信号&#xff0c;并在四个不同的通道内进行传输。如今&#xff0c;光分路器广泛应用在无源光网络&am…

从 RAG 1.0到RAG 2.0,这次做对了什么?

RAG是目前最流行的补充生成式人工智能模型的方式&#xff0c;最近 RAG 的开创者提出了新的上下文语言模型 (CLM) &#xff0c;他们称之为“ RAG 2.0 ”。 今天让我们一块来从RAG目前的原理和缺点出发&#xff0c;看看他们所提出的RAG2.0是否能够为行业带来新的希望。 LLM的时间…

提交链码-编辑前后端,调用链码功能

一 . 链码介绍 1.什么链码&#xff1f; • 链码是一段用 Go、Node.js 或者 Java 实现了规定接口的程序。链码在安全的Docker容器中运行&#xff0c; 与背书节点的进程隔离。通过应用程序提交的交易&#xff0c;链码初始化和管理账本状态。• 链码通常处理网络成员协商达成的业…

若依文件下载

后端自带工具controller package com.ruoyi.web.controller.common;import java.util.ArrayList; import java.util.List; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.slf4j.Logger; import org.slf4j.Logger…

docker常用基本命令

把jar包和 dockerfile文件放到同一目录下#构建Docker镜像 注意后面的 . 不能省略 docker build -t your-image-name .#运行并创建一个容器 docker run -d -p 8080:8080 --name container_name your-image-name# 停止容器 767fce4cb990 容器ID (容器名也可以) docker stop 767f…

HarmonyOS开发案例:【rating组件】

介绍 将引导开发者使用rating组件实现星级打分功能。 相关概念 [rating组件]&#xff1a;评分条&#xff0c;可根据用户判断进行打分。 环境搭建 软件要求 [DevEco Studio]版本&#xff1a;DevEco Studio 3.1 Release及以上版本。OpenHarmony SDK版本&#xff1a;API vers…

sCrypt全新上线RUNES功能

sCrypt智能合约平台全新上线一键etch/mint RUNES功能&#xff01; 请访问 https://runes.scrypt.io/ 或点击阅读原文体验&#xff01; 关于sCrypt sCrypt是BSV区块链上的一种智能合约高级语言。比特币使用基于堆栈的Script语言来支持智能合约&#xff0c;但是用原生Script编…

宁盾LDAP统一用户认证与单点登录:构建高效安全的企业身份认证

在信息化时代&#xff0c;企业面临着众多的应用系统和数据资源&#xff0c;如何有效地管理和保护这些资源&#xff0c;确保信息安全和高效利用&#xff0c;成为了企业信息化建设的核心问题。LDAP统一用户认证和单点登录&#xff08;SSO&#xff09;作为一种高效、安全的身份验证…

Quarto Dashboards 教程 2:Dashboard Layout

「写在前面」 学习一个软件最好的方法就是啃它的官方文档。本着自己学习、分享他人的态度&#xff0c;分享官方文档的中文教程。软件可能随时更新&#xff0c;建议配合官方文档一起阅读。推荐先按顺序阅读往期内容&#xff1a; 1.quarto 教程 1&#xff1a;Hello, Quarto 2.qu…

srpingMVC基本使用

文章目录 1. springMVC基本功能(1) maven坐标导入(2) 编写表现层(3) springMVC配置类编写(4) 部署tomcat访问 2. 各种请求方法get请求post请求put请求delete请求请求参数提取 3. 请求参数接收(1) param参数接受封装到对象中 (2) 路劲参数接收集合接受时间类型接收json参数接收m…

1.C++入门(上)

目录 1.C关键字 2.命名空间 作用域方面的优化 a.命名空间定义 b.命名空间使用 3.C 输入&输出 1.C关键字 C有63个关键字&#xff0c;C语言有32个关键字&#xff0c;存在重叠如荧光笔标出 2.命名空间 作用域方面的优化 如果变量&#xff0c;函数和类的名称都存在于全…

java 词法分析练习

import parser.Parser;import java.util.ArrayList; import java.util.Arrays; import java.util.List;public class Main {public static void main(String[] args) {// 关键词List<String> keyList new ArrayList<>(Arrays.asList("int","String…

鸿蒙APP开发页面组件之间的属性关系

我们将对于多页面以及更多有趣的功能展开叙述&#xff0c;这次我们对于 HarmonyOS 的很多有趣常用组件并引出一些其他概念以及解决方案、页面跳转传值、生命周期、启动模式&#xff08;UiAbility&#xff09;&#xff0c;样式的书写、状态管理以及动画等方面进行探讨 页面之间…

mac 教程 终端如何拆墙

一直觉得自己写的不是技术&#xff0c;而是情怀&#xff0c;一个个的教程是自己这一路走来的痕迹。靠专业技能的成功是最具可复制性的&#xff0c;希望我的这条路能让你们少走弯路&#xff0c;希望我能帮你们抹去知识的蒙尘&#xff0c;希望我能帮你们理清知识的脉络&#xff0…