如何保持 NextJS 项目的清晰和干净

如何保持 NextJS 项目的清晰和干净

已经使用 NextJS 实现了许多项目,我真的不得不说,我喜欢它。您构建 Web 应用程序的速度,尤其是与 Tailwind 结合使用的速度令人难以置信。
尽管如此,多年来我注意到项目有时会变得不清晰。
为了防止这种情况,我有两个关于如何让您的项目更易于管理的宝贵建议。

使用 src 文件夹

从 NextJS 12 开始,您可以将您正在处理的大部分文件移动到一个名为 源代码 .这使得结构更加清晰,特别是如果您将项目分成几个较小的文件夹,例如组件、模型……。
为此,只需创建一个名称为的文件夹 源代码 在根目录中并将所有内容都放在其中,除了单个文件、公共文件夹和 node_modules 文件夹。这将极大地缩小您的文件夹结构,如下所示。

Folder structure with (left) and without src folder (right)

使用组件

其次,我试图将所有页面划分为单独的组件,并相应地将它们外包为独立的组件。
所以我的主文件更短更整洁,此外,我还有可以在其他页面上重复使用的组件。因此,我尝试使组件尽可能通用并相应地参数化。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明

本文链接:https://www.qanswer.top/38366/23072111

posted @ 2022-09-21 11:23  哈哈哈来了啊啊啊  阅读(28)  评论(0编辑  收藏  举报