把Vue项目从Window系统迁移到Mac系统的方案

不能启动vue ui 直接运行,会报错如下:

failed to load config from /Users/xiaochen/IdeaProjects/ChatViewer-frontend/vite.config.ts

error when starting dev server:
Error: 
You installed esbuild for another platform than the one you're currently using.
This won't work because esbuild is written with native code and needs to
install a platform-specific binary executable.

Specifically the "@esbuild/win32-x64" package is present but this platform
needs the "@esbuild/darwin-arm64" package instead. People often get into this
situation by installing esbuild on Windows or macOS and copying "node_modules"
into a Docker image that runs Linux, or by copying "node_modules" between
Windows and WSL environments.

If you are installing with npm, you can try not copying the "node_modules"
directory when you copy the files over, and running "npm ci" or "npm install"
on the destination platform after the copy. Or you could consider using yarn
instead of npm which has built-in support for installing a package on multiple
platforms simultaneously.

If you are installing with yarn, you can try listing both this platform and the
other platform in your ".yarnrc.yml" file using the "supportedArchitectures"
feature: https://yarnpkg.com/configuration/yarnrc/#supportedArchitectures
Keep in mind that this means multiple copies of esbuild will be present.

Another alternative is to use the "esbuild-wasm" package instead, which works
the same way on all platforms. But it comes with a heavy performance cost and
can sometimes be 10x slower than the "esbuild" package, so you may also not
want to do that.

    at generateBinPath (/Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/esbuild/lib/main.js:1884:17)
    at esbuildCommandAndArgs (/Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/esbuild/lib/main.js:1965:33)
    at ensureServiceIsRunning (/Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/esbuild/lib/main.js:2129:25)
    at build (/Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/esbuild/lib/main.js:2021:26)
    at bundleConfigFile (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-abb4f102.js:66002:26)
    at loadConfigFromFile (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-abb4f102.js:65978:31)
    at resolveConfig (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-abb4f102.js:65575:34)
    at _createServer (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-abb4f102.js:64846:26)
    at createServer (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-abb4f102.js:64843:12)
    at CAC.<anonymous> (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/cli.js:743:30)

解决方案

  1. 导航到项目目录
    在终端中,使用 cd 命令导航到项目目录:
cd /Users/xiaochen/IdeaProjects/ChatViewer-frontend

这里是我的项目目录,注意切换到自己的项目目录

  1. 删除 node_modules 目录和 package-lock.json 文件
rm -rf node_modules package-lock.json

  1. 授权用户修改权限
sudo chown -R $(whoami) /Users/xiaochen/IdeaProjects/ChatViewer-frontend

不然会报错:

11:41:14 [vite] error while updating dependencies:
Error: EACCES: permission denied, mkdir '/Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/.vite/deps_temp_b5dfa112'
    at Object.mkdirSync (node:fs:1372:26)
    at runOptimizeDeps (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:45821:10)
    at runOptimizer (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:45267:38)
    at rerun (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:45400:9)
    at Timeout._onTimeout (file:///Users/xiaochen/IdeaProjects/ChatViewer-frontend/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:45470:17)
    at listOnTimeout (node:internal/timers:573:17)
    at process.processTimers (node:internal/timers:514:7)
  1. 重新安装依赖
npm install
  1. 启动项目
npm run dev

在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue后台管理系统项目从0到1,可以按照以下步骤进行: 1. 创建项目:首先,使用Vue CLI工具创建一个新的Vue项目。可以使用命令行或图形界面工具来完成这一步骤。 2. 设计界面:根据需求,设计后台管理系统的界面。可以使用UI组件库(如Element UI、Ant Design Vue等)来加快开发速度。 3. 路由配置:使用Vue Router来配置路由,定义页面之间的跳转关系。可以根据后台管理系统的功能模块进行划分,设计合理的路由结构。 4. 数据管理:使用Vuex来管理全局的状态和数据。可以定义各个模块的状态、获取数据的方法,并在组件中使用。 5. 接口调用:根据后台管理系统与后端API的交互需求,使用Axios或其他HTTP请求库来发送请求并处理响应数据。 6. 功能开发:根据需求逐步开发各个功能模块。可以按照模块划分,分别开发不同的页面和组件。 7. 数据展示:根据后台管理系统的需求,使用Vue组件来展示数据,例如表格、图表等。可以使用第三方库来提供更多扩展功能。 8. 权限控制:根据需求,实现后台管理系统的权限控制功能。可以使用路由守卫、角色权限配置等方式来限制用户的操作权限。 9. 测试和调试:完成功能开发后,进行测试和调试,确保后台管理系统的稳定性和可靠性。 10. 打包部署:最后,使用Vue CLI提供的打包命令,将项目打包为静态文件,并部署到服务器上。 通过以上步骤,你可以从零开始构建一个Vue后台管理系统项目。当然,在实际开发中还会遇到各种具体问题和挑战,需要根据具体情况进行解决。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值