运行vite项目报错:await import(‘source-map-support‘).then((r) => r.default.install())

项目场景:

Electron + vue3 + vite项目实现屏幕截图功能


问题描述

运行 npm run dev 启动项目报错 await import('source-map-support').then((r) => r.default.install())

bash 复制代码
PS D:\study\electron\electronDemo> npm run dev

> electronDemo@0.0.1 dev D:\study\electron\electronDemo> vite --mode development

file:///D:/study/electron/electronDemo/node_modules/vite/bin/vite.js:7
    await import('source-map-support').then((r) => r.default.install())
    ^^^^^

SyntaxError: Unexpected reserved word
    at Loader.moduleStrategy (internal/modules/esm/translators.js:81:18)
    at async link (internal/modules/esm/module_job.js:37:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! electronDemo@0.0.1 dev: `vite --mode development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the electronDemo@0.0.1 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\AppData\Roaming\npm-cache\_logs\2023-10-07T06_08_23_492Z-debug.log

原因分析:

目前我的 nodeJS 版本是 14.1.0 ,初步怀疑是 nodeJS 版本引起的 vite 报错

bash 复制代码
PS D:\study\electron\electronDemo> nvm ls

    16.19.0
    16.15.0
    14.19.3
    14.18.3
  * 14.1.0 (Currently using 64-bit executable)
    12.19.0
PS D:\study\electron\electronDemo>

解决方案:

采用 nvm 切换管理 nodeJS 版本,关于 nvm 的使用,请自行搜索资料。

bash 复制代码
PS D:\study\electron\electronDemo> nvm ls

    16.19.0
    16.15.0
    14.19.3
    14.18.3
  * 14.1.0 (Currently using 64-bit executable)
    12.19.0
PS D:\study\electron\electronDemo> nvm use 16.19.0
Now using node v16.19.0 (64-bit)
PS D:\study\electron\electronDemo> nvm ls

  * 16.19.0 (Currently using 64-bit executable)
    16.15.0
    14.19.3
    14.18.3
    14.1.0
    12.19.0
PS D:\study\electron\electronDemo>

再次启动项目,成功执行:

bash 复制代码
PS D:\study\electron\electronDemo> npm run dev

> electronDemo@0.0.1 dev
> vite --mode development


  VITE v4.4.9  ready in 1346 ms

  ➜  Local:   http://127.0.0.1:5173/
  ➜  Network: use --host to expose
  ➜  press h to show help
vite v4.4.9 building for development...

watching for file changes...

build started...
✓ 3 modules transformed.
dist-electron/preload.js  0.40 kB │ gzip: 0.22 kB
dist-electron/main.js     1.60 kB │ gzip: 0.82 kB
built in 164ms.
相关推荐
牧羊狼的狼4 小时前
React 中的 HOC 和 Hooks
前端·javascript·react.js·hooks·高阶组件·hoc
知识分享小能手5 小时前
React学习教程,从入门到精通, React 属性(Props)语法知识点与案例详解(14)
前端·javascript·vue.js·学习·react.js·vue·react
魔云连洲5 小时前
深入解析:Vue与React的异步批处理更新机制
前端·vue.js·react.js
mCell6 小时前
JavaScript 的多线程能力:Worker
前端·javascript·浏览器
超级无敌攻城狮7 小时前
3 分钟学会!波浪文字动画超详细教程,从 0 到 1 实现「思考中 / 加载中」高级效果
前端
excel8 小时前
用 TensorFlow.js Node 实现猫图像识别(教学版逐步分解)
前端
gnip8 小时前
JavaScript事件流
前端·javascript
赵得C9 小时前
【前端技巧】Element Table 列标题如何优雅添加 Tooltip 提示?
前端·elementui·vue·table组件
wow_DG9 小时前
【Vue2 ✨】Vue2 入门之旅 · 进阶篇(一):响应式原理
前端·javascript·vue.js
weixin_456904279 小时前
UserManagement.vue和Profile.vue详细解释
前端·javascript·vue.js