1、 node
(1)下载并安装node,国内地址,这里我下载的是解压版node-v14.15.4-win-x64.zip
,解压到自定义路径E:\installations\
下,这里我把解压文件名node-v14.15.4-win-x64
修改成了nodejs
,所以安装路径是 E:\installations\nodejs
。
(2) 配置环境变量,在系统变量在Path下添加E:\installations\nodejs
,接下来可以打开cmd
窗口测试node
和npm
。
C:\Users\ly> node -v // 测试node
v14.15.4
C:\Users\ly> npm -v // 测试npm
6.14.10
注意: msi
版本会在用户变量path
末尾添加C:\Users\用户名\AppData\Roaming\npm
,以及在系统变量path
末尾添加安装路径E:\installations\nodejs
,所以不需要配置。
2、配置npm包路径
E:\installations\nodejs
路径下新建node_cache
和node_global
文件夹,打开cmd窗口,配置包路径。
C:\Users\ly>npm config set cache "E:\installations\nodejs\node_cache"
C:\Users\ly>npm config set prefix "E:\installations\nodejs\node_global"
注意:如果是msi
版本安装,在执行npm install -g XXXX
全局下载包时,这个包的默认存放路径位C:\Users\用户\AppData\Roaming\npm\node_modules
下,占C盘空间,通常我们都会自定义npm全局安装模块所在的路径以及缓存cache的路径,修改方法也是执行上面两条命令即可。
# npm仓库在国外,速度比较慢,可使用官方推荐的 cnpm 命令行工具代替默认的 npm。
C:\Users\ly>npm install -g cnpm --registry=https://registry.npm.taobao.org
此时我们可以在E:\installations\nodejs\node_global
下看到cnpm的指令文件,cnpm
包放在node_modules
路径下。
测试安装是否成功,'cnpm' 不是内部或外部命令。
C:\Users\ly> cnpm -v
'cnpm' 不是内部或外部命令,也不是可运行的程序
或批处理文件。
这是由于环境变量未配置路径,默认是在安装路径下E:\installations\nodejs
找cnpm指令,并在E:\installations\nodejs\node_modules
下寻找cnpm
包,只要在系统环境变量path
末尾配置E:\installations\nodejs\node_global
即可。
C:\Users\ly>cnpm -v
cnpm@6.1.1 (E:\installations\nodejs\node_global\node_modules\cnpm\lib\parse_argv.js)
npm@6.14.11 (E:\installations\nodejs\node_global\node_modules\cnpm\node_modules\npm\lib\npm.js)
node@14.15.4 (E:\installations\nodejs\node.exe)
npminstall@3.28.0 (E:\installations\nodejs\node_global\node_modules\cnpm\node_modules\npminstall\lib\index.js)
prefix=E:\installations\nodejs\node_global
win32 x64 10.0.19041
registry=https://r.npm.taobao.org
注意: msi
版本将用户变量C:\Users\用户名\AppData\Roaming\npm
修改E:\installations\nodejs\node_global
即可。
3. vue/cli
C:\Users\ly>cnpm install @vue/cli -g
# 测试
C:\Users\ly>vue -V
@vue/cli 4.5.11
接下来就在cmd窗口使用命令 vue create hello
就可以创建一个项目名为hello
的vue项目,当然也可以使用vue ui,利用图形化界面创建项目。