[vue] 解决‘vue‘ 不是内部或外部命令，也不是可运行的程序 或批处理文件的方法

彩蛋：后台管理系统一站式平台模板

vue-next-admin，这是基于 vue3.x + CompositionAPI + typescript + vite + element plus + vue-router-next + next.vuex，适配手机、平板、pc 的后台开源免费模板库

一、npm 安装所在位置

自行查看环境变量，没有的话，需要把 npm所在目录路径配置 到系统环境变量中。

查看步骤如下：

• cmd 输入命令：npm config list

• prefix = "C:\\Users\\Administrator\\AppData\\Roaming\\npm" 即为 npm 安装所在的位置

C:\Users\Administrator\Desktop>npm config list
; cli configs
metrics-registry = "https://registry.npmjs.org/"
scope = ""
user-agent = "npm/6.4.1 node/v10.15.1 win32 x64"

; builtin config undefined
prefix = "C:\\Users\\Administrator\\AppData\\Roaming\\npm"

; node bin location = C:\Program Files\nodejs\node.exe
; cwd = C:\Users\Administrator\Desktop
; HOME = C:\Users\Administrator
; "npm config ls -l" to show all defaults.

二、进 npm 安装所在位置

查看是否有 vue.cmd 文件

进入到npm所安装的文件目录（C:\\Users\\Administrator\\AppData\\Roaming\\npm），查看是否有 vue.cmd 文件。

全局卸载 vue-cli

没有的话 桌面下cmd 执行cli的全局卸载 全局卸载：npm uninstall vue-cli -g;

三、桌面下 cmd 执行：全局安装 vue-cli

最后再执行一遍 全局安装：cnpm install -g @vue/cli;, 会发现npm安装的目录下出现了 vue.cmd 文件 (这里需要注意，npm 安装报错的话，使用cnpm安装)

Vue 和 vue-template-compiler 版本之间的问题

执行 npm install vue-cli -g 的后，使用 cmd ( win + R) 命令执行 vue create demo，可能会出现以下提示：

D:\projects\demo>vue create demo

  vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6.
  You may want to run the following to upgrade to Vue CLI 3:

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

执行vue create demo时，有可能又出现问题了Vue和vue-template-compiler版本之间的问题

- vue@2.6.8 (C:\Users\Administrator\node_modules\_vue@2.6.8@vue\dist\vue.runtime.common.js)
- vue-template-compiler@2.6.10 (C:\Users\Administrator\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\_vue-template-compiler@2.6.10@vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

安装相同版本的 Vue 和 vue-template-compiler

这时，在npm安装的根目录下，打开cmd, 执行 cnpm install vue@2.6.10 --save, 使 vue@2.6.8 版本与 vue-template-compiler@2.6.10 版本相同

C:\Users\Administrator\AppData\Roaming\npm>cnpm install vue@2.6.10 --save
√ Installed 1 packages
√ Linked 0 latest versions
√ Run 0 scripts
√ All packages installed (1 packages installed from npm registry, used 426ms(network 420ms), spe ed 60.92kB/s, json 1(25.59kB), tarball 0B)

四、执行 vue -V

cmd 执行 vue -V，惊喜的发现，出现了 vue 的版本号了

λ vue -V
2.9.6

五、成功界面

最后执行vue create demo， 出现以下界面， 代表成功了

Vue CLI v3.9.3
? Please pick a preset: (Use arrow keys)
> ant disign (vue-router, vuex, stylus, babel, eslint)
  default (babel, eslint)
  Manually select features