elementUI中文网址:
/#/zh-CN/component/layout
全局引入
1.安装element-ui
cnpm install element-ui --save
2.main.js引入elementUI
import ElementUI from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'Vue.use(ElementUI)
3.App.vue删掉原始内容,添加如下内容:
4.浏览器查看效果
出现一个Button按钮,点击按钮,会有弹出框。成功。
按需引入
1.安装babel组件
cnpm install babel-plugin-component -D
2.新建文件并粘贴如下内容进去
{"presets": [["es", {"modules": false }]],"plugins": [["component",{"libraryName": "element-ui","styleLibraryName": "theme-chalk"}]]}
2.mian.js修改引入
之前全局引入的部分内容注释掉
// import ElementUI from 'element-ui'// Vue.use(ElementUI)
import {Button, Dialog, Row, Col} from 'element-ui'ponent(Button.name, Button)ponent(Dialog.name, Dialog)
3.如果报错 Exit status 1
解决:创建. babelrc文件命名 点和名字中间有个空格
4.如果还报错,修改. babelrc文件
注意:如果大括号报错,换成中括号。
5.效果:可以正常使用之前定义的内容。