安装好vue-cli后输入vue -V不是内部命令一般是配置环境的问题,这个问题整整困扰了我两天我才找问题(vue小白一枚),写出来更多是为了让一些学习者明白是哪里出了问题

闲话少说,进入正题,先来一整套vue的环境搭建

安装vue先安装nodejs

node下载地址:https://nodejs.org/en/建议在64位操作系统上安装x64版本,因为对于很多nodejs的包来讲,基本都支持64位操作系统,未来部署环境也基本都是x64操作系统

安装步骤我就不多说了 下一步就可以跟安装JDK一个道理

安装VUE-cli后输入vue -V不是内部命令

Node.js runtime表示运行环境

npm package manager表示npm包管理器

online documentation shortcuts在线文档快捷方式

Add to PATH添加到环境变量

选择Node.js runtime即可

我看网上好多有配置环境变量的,我的安装后直接环境变量就已经自动配置了(不知道是版本越来越高的原因嘛),所以这里我没有配置环境变量的,如果安装好没有配置环境变量的话需要去手动配置一下,把nodejs的路径放在path环境变量即可

安装后win+R打开cmd输入node -v可查看版本npm -v可查看npm版本

安装VUE-cli后输入vue -V不是内部命令

至此nodejs是安装完成了,默认情况下我们下载全局包时路径是为默认的 可以通过npm root -g可以进行查看路径

安装VUE-cli后输入vue -V不是内部命令

我这里是修改过后的路径,如果不修改默认应该是在C:\Users\Administrator\AppData\Roaming\npm\node_modules下

但是有时候我们不想让全局包放在这里,我们想放在node的安装目录下

1、在node安装目录下下新建两个文件夹

node_global全局包下载存放

node_cachenode缓存

2、修改路径

在CMD窗口执行以下两条命令:

npm configsetprefix"C:\node\node_global"

npm config set cache "C:\node\node_cache"

或者在nodejs的安装目录中找到node_modules\npm\.npmrc文件,修改如下:

prefix =C:\node\node_global

cache = C:\node\node_cache

安装VUE-cli后输入vue -V不是内部命令

接下来我们说安装完nodejs后安装vue,搭建vue环境变量呢需要先下载vue-cli,vue-cli是从头搭建vue工程的脚手架(也就是工具),通过该工具,可以简化很多工程搭建的配置环境

我们通过输入命令行进行安装

安装VUE-cli后输入vue -V不是内部命令

安装如果没有出现erro都是WARN的话那么就是顺利安装完成的

安装完成后输入vue -V可以查看版本号(注意V是大写)

安装VUE-cli后输入vue -V不是内部命令

如果提示vue不是内部命令的话 那么找到你全局包路径,例如我的是E盘安装VUE-cli后输入vue -V不是内部命令

把这个路径配置到path环境变量即可

接着我们来创建vue项目

安装VUE-cli后输入vue -V不是内部命令

安装VUE-cli后输入vue -V不是内部命令

这里如果怕麻烦选择默认就是直接回车就好了,如果想改配置选择红框中的就可以了,我们直接选择默认的进行创建项目

项目创建完成后我们看一下生成的项目都有什么文件

安装VUE-cli后输入vue -V不是内部命令

 

这是我们生成的项目文件

如何运行项目,通过命令进入项目目录 输入 npm run server就可以(这里可能会报错)

安装VUE-cli后输入vue -V不是内部命令

我们运行的时候出错了,可以根据报错提示script 我们打开package.json看看参数是否出错

安装VUE-cli后输入vue -V不是内部命令

这里看是没有什么问题 我们把server改成dev也是一种启动方式 将参数进行修改

命令行再输入 npm run dev进行启动

安装VUE-cli后输入vue -V不是内部命令

这里我们启动成功了!我们输入网址看看

安装VUE-cli后输入vue -V不是内部命令

以上就是我安装vue的一些心得 可做技术交流

相关文章:

  • 2022-12-23
  • 2021-08-08
  • 2021-12-15
  • 2021-07-16
  • 2021-07-19
  • 2022-12-23
  • 2022-01-10
猜你喜欢
  • 2021-11-10
  • 2021-11-10
  • 2021-12-26
  • 2022-12-23
  • 2022-12-23
  • 2021-11-11
相关资源
相似解决方案