使用Vite+React遇问题：vite-pwa无法卸载及启动404错误

问题1：创建React项目自动安装vite-pwa，卸载失败 #

• 检查全局模板配置：执行 npm config get create-react-app 查看是否默认绑定了带PWA的模板，若有则重置为官方基础模板。
• 清理包管理器缓存：运行 npm cache clean --force（yarn/pnpm用户对应执行 yarn cache clean/pnpm store prune），避免缓存模板干扰。
• 强制指定官方模板创建项目：创建时明确使用官方React模板，命令为 npm create vite@latest my-react-app -- --template react（TS项目用 react-ts）。
• 彻底移除残留依赖：删除项目目录下的 node_modules、package-lock.json（或yarn.lock/pnpm-lock.yaml），手动从 package.json 中删除 vite-plugin-pwa 相关条目，再重新执行 npm install。

问题2：项目启动后出现404及Manifest语法错误 #

从报错信息判断，问题由vite-pwa自动注入的无效配置导致，解决步骤：

• 移除Vite配置中的PWA插件：打开项目根目录的 vite.config.js/ts，删除所有与 VitePWA 相关的导入和配置代码。
• 删除无效manifest文件：直接删除项目中的 manifest.webmanifest 文件，同时检查 index.html 中是否存在引入该文件的 <link rel="manifest" href="/manifest.webmanifest"> 标签，一并删除。
• 验证入口文件路径：确认 index.html 中引用 src/main.tsx 的脚本标签路径正确，应为 <script type="module" src="/src/main.tsx"></script>，路径错误则修正。
• 重装依赖并重启项目：删除 node_modules 和锁文件，重新执行 npm install，再启动项目 npm run dev。

内容的提问来源于stack exchange，提问作者daniel sas