React 下选择什么 CSS 组件?

2020-12-01 · 周二紧张

上午处理的第一个问题:在 React + NextJS 下如何选择一个更好用的 CSS 框架/组件库。除了 Antd,我还从大佬那得知了 Polaris 这个 React 组件库,但是他们都有个共同特点,就是 UI 很难定制。

说到可定制 UI 的组件框架,我第一时间想到的是 Tailwind,但是看着官方文档 提取组件 章节,总觉得这样写起来和我直接写 HTML 和 CSS 有啥区别呢?为何不直接使用 CSS 变量或者预编译器解决?最终封装成自己的 UI 组件来使用?

最终,我还是选择了使用基于我的「奇趣框架」自己写,需要快速搞出复杂交互的组件,再用 Antd 解决吧。

下午我使用 NextJS 写第一个需要背景图片的页面,就立马发现了问题,官方文档 的图片插入是基于 HTML 的 img 标签实现的,太智障了,无法直观的设置 CSS 的 background 属性,不然就层次结构混乱。我的第一直觉是使用 require() 引入图片,但是并没有成功,提示读取文件失败。

一番搜索后得知,最简单的办法就是安装 next-images 库,貌似是增加了 Webpack 的相关配置,才支持读取图片的。Stack Overflow 上有类似的问题,传送门、库的 介绍

晚上回到家,我并没有怎么淦代码,而是选择继续看《青春波纹》。毕竟,这真的是一部既热血、又可爱的一部番。这里面的女孩子真的都好可爱啊...

一边是自己的「晴风」号,另一边是自己老朋友所指挥的「武藏」号。连海上救援队都没有拿下的失控船舰,晴风号还有多少把握?岬明乃很无奈,也很伤心。她担心为了救「武藏」号伤了自己船上的人,也担心「武藏」号继续失控下去,伤了更多的人...

岬明乃:决断,你要我怎么决断。我们一直平安无事,都只是凑巧罢了,根本不是我的功劳。你们都是我亲爱的家人,一想到可能会失去你们...

黑木洋美:她的意思应该是互补不足才算真正的伙伴。宗谷同学,能辅佐舰长的,只能是你了

12.01-决断.jpg12.01-宗谷的鼓励.jpg
平常運航

平常運航

小森茂生
Paul

Paul

特立独行的一只前端菜狗。这篇日记编写大概耗时了 0 分钟,内容均为个人原创,并采用 CC BY-NC-SA 4.0 授权协议,转载请注明来源,谢谢!如本站内容对你有所帮助的话,不妨 捐助支持 一下?

近期评论

鲍小螺: 前辈多多指教!ahu: 后生可畏寻梦xunm: 真不错,板子很好看。timochan: 太惨了( ,更新暴毙,如果恢复没成功,数据也 dump 不出来鲍小螺: 在这部分对话中,广树和保罗继续讨论生活的不同方面。保罗提到了技术更新和国内的优秀 IT 技术。广树解释了在国内积累的经验如何在日本产生穿越的感觉,并表达了对于日本生活节奏的喜爱。他还提到了医疗水平的差异和对于生活方式的感受。保罗表示,通过动漫和现实的对比,艺术来源于现实,日本生活的确有着独特之处。他们讨论了国内的生活节奏和就医等方面的压力,以及个人选择的自由。最后,他们也谈到了不结婚不买房的选择和对于房价的困扰。鲍小螺: 该对话进一步讨论了房地产和税收的问题。保罗提到了国内的房地产税和增值税以及日本的固定资产税。广树解释了日本房地产税的收取方式,以及房产税对于国内房产的影响。他认为,与国内相比,日本的房子质量和服务更好。保罗提出疑问,为什么自己拥有的地也要交税。广树解释了类似增值税的原理,并指出在日本拥有房产是稳定安全的。最后,保罗表示从广树的角度来看,情况确实是如此。鲍小螺: 这篇文章的聊天记录也尝试过用 GPT 总结,结果并不是太好,不知道是不是 Prompt 的问题,实际出来的内容过于简练了,于是又耗费了半小时写完,呼~
奇趣音乐盒技术源于 Kico Player
Emmm,这里是歌词君