5 步反应文件夹结构 [2024]
将大型 React 应用程序组织到文件夹和文件中是一个经常引发强烈意见的话题。我发现写这个很有挑战性，因为没有明确的“正确”方法。然而，我经常被问到如何从小到大构建我的 React 项目，我很乐意分享我的方法。 在实现 React 应用程序几年后，我想向您详细介绍我如何在我的个人项目中处理这个问题，为我的 自由项目，以及我的 React 研讨会。只需 5 个步骤，您即可决定什么对您有意义以及您想要将其推进到什么程度。那么让我们开始吧。 单个反应文件 第一步遵循以下观点：一个文件统治所有。大多数 React 项目都是从 源代码/ 文件夹和一个 源代码/[name].(js|ts|jsx|tsx) 文件，您将在其中找到类似应用程序组件的内容。至少这是你使用时得到的 Vite 用于创建客户端 React 应用程序。如果您使用的是这样的框架 Next.js 对于服务器驱动的 React，您将从 src/app/page.js 文件。 在这里我们看到一个例子 仅在单个文件中呈现 JSX 的函数组件： const App = () => { const title = ‘React’; return ( Hello {title}h1> div> );}export default App; 随着该组件随着附加功能的发展，它的大小自然会增加，因此有必要将其分解为更小的、独立的 React 组件。在本例中，我们提取一个 […]