plugin-legacy的判断标准是全部支持以下 3 个语法就是现代浏览器,否则是传统浏览器。 import.meta.url; import("_").catch(()=>1); (async function*(){})().next(); 但是有可能,浏览器全部支持这些语法(也就是被判断为现代浏览器),却不支持其他某些被认为是现代浏览器已经广泛支持的特性。比如
一、问题: 在做vite + vue3项目,由于前端页面加载过慢,处理vite相关优化时安装相关插件提示的报错信息,在这里记录是方便遇到同样问题的小伙伴能快速解决问题。 编译: npm run build 执行: npm install @vitejs/plugin-vue -D 执行: npm install @vitejs/plugin-vue -D --force or --legacy-peer-deps 二、...
vue3版本vite使用了[@vitejs](/user/vitejs)/plugin-legacy兼容老版本浏览器, 打包出来的index-xx.js含有import()导致无法加载js文件。打开页面出现连接服务器超时。 图片 为什么会有import()语法? [@vitejs](/user/vitejs)/plugin-legacy插件会将现代 JavaScript 代码转换为老版本浏览器能够理解的代码。为了实现...
$ npm add -D @vitejs/plugin-legacy 代码语言:javascript 复制 // vite.config.js import legacy from '@vitejs/plugin-legacy' import { defineConfig } from 'vite' export default defineConfig({ plugins: [ legacy({ targets: ['defaults', 'not IE 11'], }), ], }) plugins也可以接受包含多个...
后来翻了下文档,实际可以通过 @vitejs/plugin-legacy 的 modernPolyfills 配置去解决这个问题,解决配置如下代码。同理,你也可以 Polyfills 你需要的es[13] 。 import{ defineConfig }from'vite' importvuefrom'@vitejs/plugin-vue' importlegacyfrom'@vitejs/plugin-legacy' ...
后面发现可用@vitejs/plugin-legacy解决此问题。 import legacy from'@vitejs/plugin-legacy'; 2) 受制于历史项目包袱,感受到Vite的一些痛点: Vite最新版2.7.x版本自带的less-loader, 将背景色的rgba属性转换成四位16进制在有些手机上存在兼容性问题。
// 引入 import legacy from '@vitejs/plugin-legacy'; // 插件处 plugins:[ legacy({ targets:['defaults','not IE 11'] }), vue() ] step3: 进行打包 一般正常的项目直接build step4:修改打包后的文件 step5: 进行测试 到此结束 注:快捷替换脚本(目前测试有点问题) /** * vue 一键修复 改为本...
step1: 安装 @vitejs/plugin-legacy npm i @vitejs/plugin-legacy 1. step2: 配置@vitejs/plugin-legacy相关内容,在vite.config.ts(js)中修改 // 引入 import legacy from '@vitejs/plugin-legacy'; // 插件处 plugins:[ legacy({ targets:['defaults','not IE 11'] ...
[vite-plugin-prerender] Rendering routes [/] with puppeteer… 打开调试模式,看看控制台是否报错,如果是语法报错,可能需要安装插件 @vitejs/plugin-legacy 与 terser 配置vite.config 文件: import legacy from "@vitejs/plugin-legacy"; // ...
import legacy from '@vitejs/plugin-legacy'; export default { plugins: [ legacy({ targets: ['ie >= 11'], additionalLegacyPolyfills: ['regenerator-runtime/runtime'] }) ] }; 四、总结 综上所述,虽然Vue 3不直接支持IE浏览器,但通过使用编译器和转换器、添加Polyfills以及配置Webpack或Vite,可以使...