使用ElementUI建立项目

 从 0 开始搭建 element 项目

 第一步，安装 Nodejs/NPM

https://nodejs.org/zh-cn/download/

下载安装便可！

第二步，安装 vue-cli

打开 cmd 建立，在命令行下执行命令便可安装: npm install -g @vue/cli
 安装完后，会有一个 vue 命令能够被调用: vue --version
 若是没有，请从第零步从新开始 

第二步，建立新的项目 打开 cmd 窗口，切换到相关工做目录: d: cd wodegongzuomulu 而后，在命令行下，使用 vue 命令建立项目： vue create vue-xiangmu 这时候项目就建立好了，建立好

 

的项目目录以下:

 第三步，增长 ElementUI 的支持

在刚才的命令行下，敲入命令: vue add element 若是有提醒，分别选择: Full Import? Enter SCSS support? N ZH-CN 等待完成便可。

 

 第四步，增长 router 支持

在上述的命令行下，敲入命令:

vue add router
若是有提醒，选择“回车”，“回车”….

等待完成便可！

 

 第五步，开始编码。

 另外的另外

vue add router 命令等同于: 首先执行 npm install vue-router --save 在 main.js 里添加: // 引进
import Router from 'vue-router'
import Home from './components/Home'
import About from './components/About'

// 注册
Vue.use(Router) // 定义
const router = new Router({ base: process.env.BASE_URL, routes: [ { path: '/', component: Home }, { path: '/about, component: About }
 ] })

 

vue add element 命令等同于:

首先，执行 npm install element-ui --save 在 main.js 里配置: import Vue from 'vue'; import App from './App.vue'; // 引入 js + css
import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; // 注册
Vue.use(ElementUI); new Vue({ el: '#app', render: h => h(App) });