vue脚手架构建element ui

1.vue cli构建Vue项目 

vue init webpack element_project

vue脚手架构建element ui_第1张图片

2.运行项目npm run dev

 http://localhost:8080    

vue脚手架构建element ui_第2张图片

3.安装element ui框架

npm i element-ui -S

4.在项目中使用element-ui 

引入 Element,在 main.js 中写入以下内容:

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.use(ElementUI);

new Vue({
  el: '#app',
  render: h => h(App)
});

5.重新启动项目

在helloworld中添加以下代码

 
      默认按钮
      主要按钮
      成功按钮
      信息按钮
      警告按钮
      危险按钮
    

重新启动项目 

npm start

vue脚手架构建element ui_第3张图片 

 

你可能感兴趣的:(前端,vue,elementui)