要将Vue 2项目从Webpack迁移到Vite,你可以按照以下步骤进行操作: 1. 理解并备份当前Vue2 + Webpack的项目结构和配置 首先,你需要对现有的Vue 2 + Webpack项目有深入的理解,并备份整个项目结构和所有配置文件。这包括但不限于webpack.config.js、package.json、babel.config.js等文件。 2. 安装Vite并初始化新...
三. 迁移流程 先创建新的vite项目 新版vite项目默认是支持vue3的,需要把vue改成vue2版本后配置vite-plugin-vue2插件来支持vue2 把项目代码改成vue2写法,确保新vite项目可以正常运行vue2 把原webpack项目生产环境依赖复制到vite项目,剔除掉webpack相关的插件依赖 复制原项目src文件代码和其他业务相关代码到新vite项目...
case1:src/demo1/index.vuecase2:src/demo2/index.jscase3:src/demo3.vue// ❌ in vite , in webpackimportdemo1from'src/demo1'importdemo2from'src/demo2'importdemo3from'src/demo3' 也就是说, vite会找不到文件夹内的index.js,index.vue以及你在webpack默认省略拓展名.vue, 也会导致找不到文...
1. vite 目前要求入口文件必须是根目录下的 index.html，如果之前的 webpack 入口文件同名，需要更改。解决方案：vite.config.js:import { injectHtml } from 'vite-plugin-html'; export default defineConfig({ plugins:[ injectHtml({ // 入口文件 index.html 的模板注入 injectData: { // 模板注...
2. 在根目录新建一个文件 vite.config.js, 复制以下内容 /** 本地开发用 */import{ defineConfig }from'vite'import*aspathfrom'path'importfsfrom'fs'import{ createVuePlugin }from'vite-plugin-vue2'// 支持 vue2// 兼容webpack里面的require.context() 把require.context() 转成 import ... from ....
前端工程化vue2+webpack3项目迁移vite2踩坑总结：一、迁移过程中的主要问题 依赖与配置问题：Vue2支持：vite默认支持Vue3，需要安装vitepluginvue2插件来支持Vue2项目。依赖缺失：迁移过程中可能会出现找不到依赖的问题，需要确保所有依赖都已正确安装。路径问题：由于项目结构的变化，路径配置可能需要调整。
本文记录了在本项目迁移过程中遇到的问题,遇到的问题肯定只是webpack迁移vite很小的一部分问题,以后在迁移其他项目时候遇到新的问题也会补充进来。 本次迁移最终vite配置 import { defineConfig } from "vite"; import { createVuePlugin } from "vite-plugin-vue2"; import CompressionWebpackPlugin from 'vite-pl...
2024 年了,webpack 构建的 vue2 项目,由于路由较多,每次修改都会出现编译时间较长的问题(平均 10～40 秒),长期开发的话,非常的不友好。因此决定升级 vite构建。参考了几篇文章,基本 每篇遇到的坑都不少。 本文做一个记录。 主要是各个依赖的版本问题。 全局安装的 v
升级版本，同时满足了 webpack/vite 的打包要求 - "node-sass": "^4.9.2",+ "node-sass": "^6.0.0",- "sass-loader": "^7.0.3",+ "sass-loader": "^10.0.0"index.html <!DOCTYPE html> <link rel="stylesheet" href="<%- htmlWebpackPlugin.options.navCss...
公司内部 OA 系统,基于 vue2+webpack2 开发,目前页面有上百个,每次启动开发或者编译都需要至少 5 分钟,非常慢。由于 vite 官方没有原生支持 vue2.0,需要依赖于第三方插件,而且对于编译的稳定性和风险没办法保证,因此本次引入 vite 优先保证本地开发服务器的运行,尽量避免修改代码,编译还是由原来的 webpack 来执...