在 Quasar cli 搭建的 vue 项目中 引用 ElementUI 组件

在 Quasar cli 搭建的vue项目中 引用 ElementUI 组件

最近在发现有一个知乎上大家都吹爆好用的前端ui框架 quasar，支持全平台，组件非常丰富。

同时针对所有平台的源代码：响应式桌面/移动网站，PWA（渐进式Web应用程序），移动APP（外观原生）和多平台桌面应用程序（通过Electron）
（摘抄自官网）

这么牛逼，当然要来试试水啦，quasar 比较新，国内也比较少用，所以出bug的时候在网上比较难找到解决方法，所以在这里记录以下。


先简单介绍以下 quasar， 官方网站： http://www.quasarchs.com

quasar 上手门栏比 vant、elementUI 相对来说要难一些，用quasar cli 创建的项目目录跟用传统vue cli 创建的项目目录有些不同，因此引入方式也不一样。

1. 先按照 ElementUI 官网 上的方式，安装 ElementUI

npm i element-ui -S

2. 在 quasar cli 创建的项目下，找到 src 目录下的 boot 文件夹，新建一个 elementUI.js 文件
   
   文件内容如下

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

Vue.use(ElementUI);
export { ElementUI }

3. 找到 项目下的 Quasar App配置文件 quasar.conf.js ，在 boot 下 加入 ‘ElementUI ’

然后就可以直接引用了。