猿创征文| ‘vue‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件。

在使用vue ui搭建项目时遇到'vue'不是内部或外部命令的问题。解决方法包括检查npm安装,确认vue.cmd存在,如不在则使用管理员权限在PowerShell中安装。vue ui提供界面化创建项目,简化流程,可根据需求选择预设并配置,如Router、Vuex等,方便快捷地初始化项目。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

‘vue’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。

今天在使用vue ui进行搭建项目的时候出现了这个问题,

在Visual Studio Code中通过vue ui指令使用脚手架安装项目时,终端报错:

‘vue’ 不是内部或外部命令,也不是可运行的程序或批处理文件。

解决方法如下:

解决方案:

1、确定npm是否已正确安装,在cmd中输入如下指令:

npm -v

image.png

当显示版本号时说明npm已成功安装。

可以看到,我现在安装的npm版本是7.21.1,这是符合的,下一步

2、进入node.js的安装目录中查看一级目录下是否存在vue.cmd指令;

image.png

如果看不到该指令,则回到控制台;

使用搜索进入power shell控制面板(记得要右键以管理员身份进入)

然后在power shell面板输入以下命令

npm install -g vue
npm install -g  @vue/cli 

注意:第二个指令如果不成功,将npm更换为cnpm再试试。

3.安装成功后使用

安装成功后可以在任意窗口打开cmd命令行,运行

npm -v

指令,会得到以下图示,当显示版本号时说明npm已成功安装。

image.png

此时,我们就可以通过vue指令来进行操作了。这时我们直接使用vue ui创建项目就好了

image.png

vue ui介绍

比起繁琐的命令创建vue项目,我更喜欢使用vue ui创建项目,界面化工具,赏心悦目,而且配有文字说明,让你知道每一步都在做什么,甚是好用

image.png

image.png

选择预设,根据你的项目需要的插件来选择,这里选择手动,如下图所示

image.png

根据咱们的业务需求来选择配置,比如Router,Vuex,CSS预处理器是我们经常用到的东西,我们就可以选择它们,如下图所示

image.png

image.png

image.png

在上图你可以保存为你的预设,也可以不保存,直接创建项目,完成之后如下图所示

image.png
然后你用编译器打开项目就可以发现,之前选择的router,vuex以及less全部帮我们装好了,就可以直接使用了,是不是很方便?

下载新的插件
我们的项目中难免会用到elementui以及axios,我们直接安装就可以使用了

image.pngimage.png 这样一个项目就创建好了,是不是很简单

评论 10
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

马宸

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值