前言

uni-app是一个很牛逼的开发框架，这是没错的，但是，正是因为它兼顾H5、小程序、生成原生app，所以它又存在很多的不足，这里就讨论一下。

你在用uni-app开发什么？

uni-app主要用途我认为只有两个：

鸡肋用途是：

开发H5：Vue CLI不香么？干嘛要用uni-app呢？
开发其他小程序：需求少，当然，如果一定要开发，那么uni-app依然是首选。
开发轻应用：轻应用并没有流行起来。
多端并行开发：uni-app尽管花了很大的力气抹平了多端的差异，但是，抹平绝对不是那么简单的，复杂功能的话还是要分离开发，况且，业务上并不需要多端使用完全相同的界面、完全相同的功能，往往是分离开发，除非是业务需要同时开发微信小程序、百度小程序……各种小程序，它们的差异最小，这种情况是唯一值得并行开发的。

为什么不用小程序原生代码开发小程序？

需要花时间去学习。
只要是语言或者较为底层的框架，就一定要有生态，这个语言和底层框架才能良性发展，原生小程序的生态当然比不过Vue.js的生态，Vue的很多组件能直接用于uni-app开发小程序，更何况uni-app自身也有了一定规模的生态，很多开发者会开发一些.vue扩展名的组件用于小程序开发。

为什么不用weex开发APP？

只开发微信小程序的话，肯定是用微信开发者工具预览。但是，如果只开发APP呢？这时候你就有2种选择：

这两种方案各自有优势，总体说：

你越打算贴近腾讯生态，越打算使用APP原生功能，或者知道某些功能在H5里不可能正常预览，你就越应该偏向微信开发者工具预览；缺点：开发速度略慢（微信开发者工具刷新速度慢），不能定制化原生组件。
你越希望定制化，越在意开发速度，你就越应该偏向H5预览。缺点：贴近腾讯生态的功能调试困难，APP原生功能预览困难，小程序组件无法定制。举个例子：如果你想调整的indicator-dots的位置，事实上通过H5可以改变indicator-dots位置，并且在APP上生效，但是小程序开发者工具预览的话，无论从API来看，还是到Wxml里找，都找不到修改indicator-dots位置的方法。

《关于uni-app的ui库、ui框架、ui组件》：https://ask.dcloud.net.cn/article/35489

假设你基于小程序开发者工具预览，那么使用第三方组件的体验是跟上面是一样的：

现在假设你基于H5预览：

如果你用第三方原生小程序组件的话，uni-app会将原生小程序组件编译成H5可用代码，但是这里有个问题，就是原生小程序组件的开发者并不知道你是打算用在H5上的，所以有一定概率会编译出错。这里有个提醒，个别H5无法预览不代表APP里不可用，你还可以抱着一线希望看手机模拟器的预览。
如果你用针对vue的组件的话，看起来应该是万无一失的，不过复杂的组件也或许有小问题。

首先说，用CLI方式创建项目，问题更多，我这边只用HBuilder X创建来说明。

安装vant的方法是在项目目录执行yarn add vant，然后按照官方手册全局import。

此时H5预览项目你会发现CSS报错，解决办法是：

新建postcss.config.js，加入：

module.exports = {
  exclude: ['node_modules/vant']
}

那就在