2天，我放弃 Uniapp 立马用 Quasar 写了个 APP

一直以来，州的先生就计划为 MrDoc 开发一个移动端的APP。

因为对于现在的人来说，大块用来思考和记录的时间越来越少。相反的，碎片化的时间越来越多、碎片化的知识也出现得越来越多。

作为一个文档管理和知识库系统，MrDoc 理应提供一个能够碎片化记录文档的工具。

为什么不用 Uniapp 了

作为国内为数不多的多端开发方案，Uniapp的能力毋庸置疑。

最初，州的先生也是计划使用 Uniapp 开发这个 APP 的，并且一直都在使用 Uniapp 推进着这个 APP 的进度。

但是最近，在这个 APP 的两个核心功能上，卡壳了。

• 文本编辑器
• 接收第三方应用的分享

文本编辑器用于在 APP 上快速记录和修改文档。接收第三方应用分享，则可以让 MrDocAPP 化身成为一个移动端的剪藏工具，快速收藏碎片化的文章、图片等。

但是这两个功能，我在Uniapp论坛、文档里面找了无数次，都没有发现能够达到可用成都的解决方案。

心力憔悴之余，感受到使用 Uniapp 开发 APP 的拧巴。

这股拧巴在于：

• 作为一个基于 Vue 的框架，很多 Vue 里面能使用的东西，在 uniapp 里却使用不了。
• 多端的组件和API，对 APP 原生功能的支持有限。
• 看似繁荣的插件市场，很多插件都不兼容。
• 一些原生性的Bug，官方迟迟不修复。

投入 Quasar 的怀抱

转头一想，不是还有个基于 Vue 的框架 Quasar也宣传可以创建移动端APP吗。

那就试试吧。

安装 Quasar CLI

Quasar CLI 是 Quasar 的最大功能亮点。通过 Quasar CLI，可以开箱即用地构建所支持的平台应用。

官方推荐使用 yarn 进行包的管理。

1.yarn add @quasar/cli

运行上述命令，即可安装完成。

创建 quasar 项目

安装好 Quasar CLI 后，我们通过它来创建项目：

1.quasar create mrdoc-app-quasar

运行上述命令，就创建了一个名为mrdoc-app-quasar的项目，项目结构如下所示：

基本上我们只需要关注/quasar.conf.js (Quasar应用配置文件)、/src/router、 /src/layouts、 /src/pages 以及可选的 /src/assets。

按照常规的 Vue 开发方式，在router里面定义路由，在pages里面编写页面。

要使用 npm 库，直接安装即可也不用担心兼容不兼容。

运行 Quasar 项目

如果想要运行 Web 项目，可以执行如下命令：

1.quasar dev

这将启动开发服务器。

如果想要运行 Android 项目，可以执行如下命令：

1.quasar dev -m capacitor -T android

这将调用 Android Studio，然后可以选择模拟器或USB链接的手机来启动应用。

打包项目

在项目开发好之后，我们就可以进行打包了。运行如下命令即可打包为 Android apk：

1.quasar build -m capacitor -T android

打包完成后apk文件将会生成在项目的\dist\capacitor\android目录内：

效果

最后，来看看州的先生用 Quasar 开发的 MrDoc APP。

首页列表：

首页新建文集：

文档编辑器：

加入系统分享列表：

接收其他应用的分享：

总的来说，Quasar 开发 APP 给个人的体验要比 Uniapp 好很多，这个好，可以用一个词：「顺畅」来形容。顺畅地开发、顺畅地调用、顺畅地打包。

至于小程序，uniapp 依然还是自己的首选方案……