将项目从 Webpack 到 Vite 迁移的步骤

迁移从 Webpack 到 Vite 的步骤可以概括为以下几点:

  1. 使用Vite新建项目 :在终端中运行下述命令
    npm create vite@latest alarm_vite
    cd alarm_vite
    npm install
  2. 更新代码 :将原项目中的src文件夹下的代码迁移到alarm_vite的src中。
  3. 修改 Vite 配置文件 :修改 vite.config.js,主要包括element引入方式、svg使用插件、文件输入输出方式、css的加载配置。
  4. 调整文件结构:根据 Vite 的要求调整项目结构,确保入口文件(index.html、main.ts、APP.vue)和静态资源路径正确。
  5. 安装依赖 :npm run dev启动项目后,根据报错提示安装项目所需的依赖。
  6. 测试和调试:启动开发服务器,测试项目是否正常运行,并根据报错进行调试。

【注】 :Vite不支持使用require相关方法导入模块和图片等,所以在迁移时要注意修改为import导入资源,具体可以参考该blog。

https://blog.csdn.net/sinat_31213021/article/details/136401928#:\~:text=首先, Vite 中没有,require 相关方法,因为它默认支持 ESM 方式加载模块!

相关推荐
2603_965896621 分钟前
CSS BEM 命名规范|组件化样式分层权威指南
前端·javascript·css
进击的明明2 分钟前
前端开发中的 BEM 国际命名规范:让 CSS 不再"打架"
前端·css·html
deli0076 分钟前
中文在网址里为什么变成 E4B8AD?URL 编码 22 组用例实测
前端
羲云11 分钟前
MOSS-Image 开源后爆火:5B 生图模型真正值得关注的,是可控排版
前端
BreezeJiang20 分钟前
闭包和 useState 是两个知识点?你可能只学了半条作用域链
前端·面试
2601_9583529031 分钟前
一款模块通吃15类语音产品?AN-93如何实现录音笔、门禁、IPC的快速适配
前端·人工智能·嵌入式硬件·回声消除·降噪处理
子兮曰33 分钟前
Bun v1.4.4 实测:2,025 个文件,bun fmt 2.6 秒跑完
前端·后端·bun
Liudef0633 分钟前
用 DeepSeek Search API 做一个干净的单文件搜索页面(附完整源码)
前端·人工智能·工具·搜索·deepseek
忆挽篱笙歌1 小时前
进程替换函数与shenll命令行解释器
前端·javascript·算法
计算机魔术师1 小时前
砸了2200亿美元还是不够用,AWS说2027年也卖完了
前端