脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript类库 → vue.js → vue3.0运行npm run dev报错

vue3.0运行npm run dev报错Cannot find module node:url

 更新时间：2023年10月25日 15:28:23   作者：baorant在写代码  
本文主要介绍了vue3.0运行npm run dev报错Cannot find module node:url,因为使用的node版本是14.15.1低于15.0.0导致,具有一定的参考价值,感兴趣的可以了解一下

问题背景

近期用vue3.0写项目，npm init vue@latest —> npm install 都正常,npm run dev的时候报错如下：

failed to load config from F:\code\testVue\vue-demo\vite.config.js
error when starting dev server:
Error: Cannot find module 'node:url'
Require stack:
- F:\code\testVue\vue-demo\vite.config.js
- F:\code\testVue\vue-demo\node_modules\vite\dist\node\chunks\dep-bb8a8339.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)

问题分析

因为使用的node版本是14.15.1低于15.0.0导致，安装node版本等于或者大于15.0.0版本，然后npm run dev即可。

问题解决

不同的环境，对nodejs版本的要求不一样，我们可以使用nvm工具，管理和切换node.js的版本。

（1）nvm下载：https://nvm.uihtm.com/

（2）nvm命令提示

nvm arch：显示node是运行在32位还是64位。
nvm install <version> [arch] ：安装node， version是特定版本也可以是最新稳定版本latest。可选参数arch指定安装32位还是64位版本，默认是系统位数。可以添加--insecure绕过远程服务器的SSL。
nvm list [available] ：显示已安装的列表。可选参数available，显示可安装的所有版本。list可简化为ls。
nvm on ：开启node.js版本管理。
nvm off ：关闭node.js版本管理。
nvm proxy [url] ：设置下载代理。不加可选参数url，显示当前代理。将url设置为none则移除代理。
nvm node_mirror [url] ：设置node镜像。默认是https://nodejs.org/dist/。如果不写url，则使用默认url。设置后可至安装目录settings.txt文件查看，也可直接在该文件操作。
nvm npm_mirror [url] ：设置npm镜像。https://github.com/npm/cli/archive/。如果不写url，则使用默认url。设置后可至安装目录settings.txt文件查看，也可直接在该文件操作。
nvm uninstall <version> ：卸载指定版本node。
nvm use [version] [arch] ：使用制定版本node。可指定32/64位。
nvm root [path] ：设置存储不同版本node的目录。如果未设置，默认使用当前目录。
nvm version ：显示nvm版本。version可简化为v。

（3）安装node.js版本

1）nvm list available 显示可下载版本的部分列表

2）nvm install 16.19.0 安装指定版本（nvm install latest安装最新版本 ）

注意：命令行切换(注意：请切换国内镜像后再安装node版本，否则会很慢)
阿里云镜像

nvm npm_mirror https://npmmirror.com/mirrors/npm/
nvm node_mirror https://npmmirror.com/mirrors/node/

3）安装完成后，查看已安装版本

nvm list

4）切换node版本

nvm use 16.19.0

3）重新运行npm run dev，成功运行vue3项目

到此这篇关于vue3.0运行npm run dev报错Cannot find module node:url的文章就介绍到这了,更多相关vue3.0运行npm run dev报错内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

  • 有关vue 组件切换,动态组件,组件缓存

    有关vue 组件切换,动态组件,组件缓存

    这篇文章主要介绍了有关vue 组件切换,动态组件,组件缓存，在组件化开发模式下，我们会把整个项目拆分成很多组件，然后按照合理的方式组织起来,达到预期效果，下面来看看文章的详细内容
    2021-11-11
  • vue实现两列水平时间轴的示例代码

    vue实现两列水平时间轴的示例代码

    本文主要介绍了vue实现两列水平时间轴的示例代码，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-11-11
  • vue打包后生成一个配置文件可以修改IP

    vue打包后生成一个配置文件可以修改IP

    本文主要介绍了修改Vue项目运行的IP和端口，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2023-03-03
  • Element Table的row-class-name无效与动态高亮显示选中行背景色

    Element Table的row-class-name无效与动态高亮显示选中行背景色

    这篇文章主要介绍了Element Table的row-class-name无效与动态高亮显示选中行背景色，本文详细的介绍了解决方案，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2018-11-11
  • vue中cookies的使用方式

    vue中cookies的使用方式

    这篇文章主要介绍了vue中cookies的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-08-08
  • Vue 中插槽的使用总结

    Vue 中插槽的使用总结

    这篇文章主要向大家分享的是Vue 中插槽的使用总结，包括内容有默认插槽、具名插槽、作用域插槽等内容，具有一定的参考价值，需要的小伙伴可以参考一下
    2022-04-04
  • vue2.0 keep-alive最佳实践

    vue2.0 keep-alive最佳实践

    这篇文章主要为大家详细介绍了vue2.0 keep-alive的最佳实践，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 在vue自定义组件中使用 v-model指令详情

    在vue自定义组件中使用 v-model指令详情

    这篇文章主要介绍了在vue自定义组件中使用 v-model指令详情，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下
    2022-06-06
  • Vue前端导出Excel文件的详细实现方案

    Vue前端导出Excel文件的详细实现方案

    在开发后台管理系统的时候,很多地方都要用到导出excel表格,比如将table中的数据导出到本地,下面这篇文章主要给大家介绍了关于Vue导出Excel文件的相关资料,需要的朋友可以参考下
    2021-09-09
  • vue 关闭浏览器窗口的时候,清空localStorage的数据示例

    vue 关闭浏览器窗口的时候,清空localStorage的数据示例

    今天小编就为大家分享一篇vue 关闭浏览器窗口的时候,清空localStorage的数据示例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11

最新评论