element-ui作为一个UI框架来说基本可以说比较完美了,和nuxt完美结合,可以选择性引用,官方就有说明文档告诉我们如何适配nuxt,用可以可以说非常顺手,我在开发steamstats.cn的时候首先选的就是element-ui。
优点前面也说了,在nuxt中使用ui框架的时候,有几点是有缺点的

  • 按需引用的时候我们需要在nuxt.config.js中单独引用对应的css文件,写起来就像以前写html一样,组件中没有包含css样式,很麻烦
  • 部分组件并不支持ssr,比如table,网页开发中ssr可以说比较重要的,至少我会比较追求seo,毕竟有收录才有流量嘛

基于element-ui的Table组件没有ssr,且解决起来比较麻烦,我尝试了一些其他选择,最后发现了好用的vuetify,使用了才发现vuetify的强大,它居然能够选择性build,比如我们引入了v-simple-table,它就只会将v-simple-table相关的样式,组件内容打包了,这个自动的功能真的非常方便。它的table相对于element-ui来说更加html原生化,所以也支持ssr。目前来看,nuxt-module也更新了vuetify的2.0版本,可以说完美适配。今天重写了table后,发现样式会在页面加载之后才加载,就是先显示了没有样式的table+数据,然后才渲染样式,具体情况后续再观察。
不过总体来说vuetify的样式效果,加上这套机制,还是很棒,大家可以上手试试。