解决vite不是内部或外部命令,也不是可运行的程序 或批处理文件。

简介: 笔记

前言


今天是要vite创建vue3.0项目的时候,到了最后一步npm run dev的时候出现了以下错误:


‘vite’ 不是内部或外部命令,也不是可运行的程序

或批处理文件。


如下图所示

5.png



思考问题


想了半天,调试了很久,本来以为是环境的问题,是不是没有缺少哪些配置


但是查了资料发现,如果是使用vite创建vue3.0项目的时候,vite不会自动帮助我们install相关的依赖,需要我们手动去安装,想到这里恍然大悟


然后我去项目的node_modules目录里面查看,果然什么都没有


所以说出现这个问题的原因是:缺少安装依赖这一步! vite不像node或cli,会自动帮助我们执行npm i (install)命令去下载相关依赖,需要我们手动下载


解决问题


输入命令下载依赖:


npm i


可以看到确实帮助我们下载了很多的依赖

6.png

这时候再次运行npm run dev,已经解决了这个问题

7.png

扩展


既然问题解决了,顺便带大家看下使用vite创建出来的vue3.0给我们的初始化页面是什么样子吧

和vue2.0以及使用cli创建的vue3.0的界面比起来,清爽了很多,并且给我们提供了一个计数器的demo

8.png

本质还是一个HelloWorld的组件

9.png


相关文章
|
JavaScript 内存技术
nvm详细安装及使用
nvm详细安装及使用
|
算法 Java 测试技术
SpringBoot@Profile详解
SpringBoot@Profile详解
1069 0
|
XML 前端开发 Java
SpringMVC入门到实战------2、SpringMVC创建实例Hello SpringMVC(maven+tomcat)
这篇文章是SpringMVC框架的入门教程,详细指导了如何在IDEA中使用Maven和Tomcat创建SpringMVC工程,包括添加依赖、配置web.xml、编写控制器、创建配置文件、配置Tomcat服务器以及进行基本的测试,展示了一个简单的Hello SpringMVC示例。
SpringMVC入门到实战------2、SpringMVC创建实例Hello SpringMVC(maven+tomcat)
|
资源调度 JavaScript Windows
yarn install命令运行报错:无法将“yarn”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。...
yarn install命令运行报错:无法将“yarn”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。...
4017 1
yarn install命令运行报错:无法将“yarn”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。...
|
12月前
|
Linux 内存技术
使用npm install -g pnpm的时候报错
使用npm install -g pnpm的时候报错
1975 139
|
安全 Java API
Java日期时间API:从Date到Java.time
本文深入解析了Java 8中引入的全新日期时间API,涵盖LocalDate、LocalTime、LocalDateTime、ZonedDateTime等核心类的使用,以及时间调整、格式化、时区处理和与旧API的互操作。通过实例对比,展示了新API在可变性、线程安全与易用性方面的显著优势,并提供迁移方案与实战技巧,助你掌握现代Java时间处理的最佳实践。
|
JavaScript 内存技术
解决报错--‘vite’ 不是内部或外部命令,也不是可运行的程序!
解决报错--‘vite’ 不是内部或外部命令,也不是可运行的程序!
|
JavaScript
cnpm 的安装与使用
本文介绍了npm和cnpm的概念、安装nodejs的步骤,以及cnpm的安装和使用方法,提供了通过配置npm使用中国镜像源来加速包下载的替代方案,并说明了如何恢复npm默认仓库地址。
cnpm 的安装与使用
|
缓存 JavaScript 前端开发
拿下奇怪的前端报错(三):npm install卡住了一个钟- 从原理搞定安装的全链路问题
本文详细分析了 `npm install` 过程中可能出现的卡顿问题及解决方法,包括网络问题、Node.js 版本不兼容、缓存问题、权限问题、包冲突、过时的 npm 版本、系统资源不足和脚本问题等,并提供了相应的解决策略。同时,还介绍了开启全部日志、使用替代工具和使用 Docker 提供 Node 环境等其他处理方法。
17105 2
|
存储 前端开发 中间件
vue3之vite配置vite-plugin-mock使用mock轻松创建模拟数据提高开发效率
vue3之vite配置vite-plugin-mock使用mock轻松创建模拟数据提高开发效率
3352 0