彩蛋:后台管理系统一站式平台模板
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