一、安装node.js
1.安装Node.js,直接下载最新的
2.在cmd命令行中验证,使用node -v,npm -v
二、Node.js环境变量配置
1.首先在node.js的安装目录新建两个文件夹node_global和node_cache
2.创建完两个文件夹后,在cmd窗口中输入以下命令(两个路径即是两个文件夹的路径):
npm config set prefix "D:\service\nodejs\node_global" npm config set cache "D:\service\nodejs\node_cache"
3.接下来设置电脑环境变量,右键“我的电脑”=》属性=》高级系统设置=》环境变量 进入以下环境变量对话框
4.在【系统变量】新建环境变量 NODE_PATH,值
D:\service\nodejs\node_global\node_modules,其中D:\service\nodejs\node_global是
上述创建的全局模块安装路径文件夹
5.修改【用户变量】中的path变量,将\AppData\Roaming\npm修改为
D:\service\nodejs\node_global
6.点击确定后,配置完成。
三、安装淘宝镜像
1.首先用如下命令对镜像服务器地址进行永久设置
npm config set registry https://registry.npmmirror.com
2.验证是否成功
npm config get registry
3.再使用命令安装淘宝镜像
npm install -g cnpm --registry=https://registry.npmmirror.com
npm install -g cnpm@6.14.10(设置npm版本)
4.验证命令:cnpm -v
5.补充:cnpm 如何版本降级
npm install -g cnpm@6.1.0
@6.1.0是版本!是版本!是版本!
注意:安转完成之后记得关闭cmd操作框,重新打开验证
四、安装webpack
使用cnpm 安装
1.利用cnpm安装webpack 命令行语句为cnpm install webpack -g
2.利用cnpm安装webpack-cli 命令行语句为cnpm install webpack-cli -g
使用npm 安装
1.利用npm安装webpack 命令行语句为npm install webpack -g
2.利用npm安装webpack-cli 命令行语句为npm install webpack-cli -g
验证命令:webpack -v
五、安装vue
cnpm install vue
或者
npm install vue
六、全局安装vue-cli
1.安装语句为:
cnpm install --global vue-cli
或者
npm install --global vue-cli
2.验证命令:vue -V (V要大写)
注意:
1.如果需要安装3.x版本,将vue-cli改为@vue/cli即可
安装之前先卸载旧版本 npm uninstall -g @vue/cli
安装3.0及其以后版本 npm install -g @vue/cli@x.x.x
安装3.0以前的旧版本 npm install -g vue-cli@2.x
2.安装webpack-dev-server要和vue版本一致,webpack-dev-server版本和vue版本不一样,需要将webpack-dev-server卸载了,安装对应版本
解决方法:
1 查看vue-cli版本是 vue -V
2 卸载cnpm uninstall webpack-dev-server
3 安装cnpm i webpack-dev-server@2.9.6
4 安装cnpm install webpack cli -D
5 正常启动。