一、Vue 基础安装及集成Element-UI

一、概述

本篇仅仅是安装vue及集成elementUI，不做过多深入
还主要记录下代理环境下使用npm
流程：

• 安装nodejs（略过）
• 安装npm(nodejs自带，略过)
• 设置代理(可选)
• 安装cnpm
• 安装vue
• 安装vue-cli3.x
• 新建vue项目
• 安装element-ui
  参考链接：
  https://www.jianshu.com/p/96d7558e643b

二、代理设置（可选）

公司使用代理上网，需要设置npm代理，如果不使用代理，此步骤略过
设置代理：

npm config set proxy http://proxyIp:port
npm config set https-proxy http://proxyIp:port
// 如果使用了cnpm 则需要执行
cnpm config set proxy http://proxyIp:port
cnpm config set https-proxy http://proxyIp:port
// 取消代理
npm config delete proxy
npm config delete https-proxy
// 如果使用了cnpm代理
cnpm config delete proxy
cnpm config delete https-proxy

三、安装cnpm

npm下载不是一般的慢，建议切换到cnpm国内镜像
其实就是切换了registry地址（淘宝镜像），有两种方式，一种方式是直接切换npm的registry地址，另一种是使用cnpm，它感觉就是npm套了个马甲，更换了内部的regisrty

• 更换npm registry

// 临时切换
npm --registry https://registry.npm.taobao.org install express
// 永久切换
// 就算使用cnpm，这个最好也设置下，因为vue项目create的时候用的还是这个
npm config set registry https://registry.npm.taobao.org

切换成功后，可以执行下面的命令查看下registry的地址

npm config get registry
// 或者查看详细信息
npm info express

• 使用cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org
// 查看配置
cnpm install express

四、安装vue（全局安装）

cnpm install -g vue

五、安装vue-cli3.x

vue-cli3.x的安装与2.x的安装命令略有区别

cnpm install -g @vue/cli

六、新建vue项目

vue create 项目名称

按照提示一步一步来就可以，模块选择那，空格是选择，回车是下一步

七、安装element-ui

进入到新建项目的根目录执行：

cnpm i element-ui -S

会自动安装到项目的node_modules目录下，然后就可以愉快地使用element-ui了

八、总结

万事开头难，环境搭起来，剩下的就是学习具体的模块了~