60.Element-UI的基本使用

Element-UI:一套为开发者, 设计师和产品经理准备的基于vue 2.0的桌面端组件库 官网地址：http://element-cn.eleme.io/#/zh-CN (opens new window)

• 60.Element-UI的基本使用
  • 1.基于命令行方式手动安装
  • 2.基于图形化界面自动安装

1.基于命令行方式手动安装

① 安装依赖包: npm i element-ui -S

② 导入 Element-UI 相关资源

// 导入组件库
import  ElementUI  from  'element-ui';
// 导入组件相关样式
import 'element-ui/lib/theme-chalk/index.css';
// 配置 Vue 插件
Vue.use(ElementUI);

2.基于图形化界面自动安装

① 运行 vue ui 命令, 打开图形化界面

② 通过 Vue 项目管理器, 进入具体的项目配置面板

③ 点击 插件 -> 添加插件, 进入插件查询面板

④ 搜素 vue-cli-plugin-element 并安装

⑤ 配置插件, 实现按需导入, 从而减少打包后项目的体积