在 React TypeScript 项目中，常量和类型定义应该放在哪里？

Number of views 58
webfrontend reactjs

我想知道应该把React应用中经常使用的常量和类型定义放在哪里。有没有什么相对标准的方案可循

我是Tony马12
2 Answers

在React TypeScript项目中，通常将常量和类型定义放在单独的文件或目录中，以便更好地组织代码结构。以下是一些建议：

  1. 将所有类型定义放在一个名为 types.ts 或 index.d.ts 的文件中。types.ts 是一种常见的命名方式，而 index.d.ts 用于声明全局类型。 “`typescript // types.ts

export interface User { id: number; name: string; }

export const enum Role { Admin = ‘admin’, User = ‘user’ }

2. 如果你有很多常量需要管理，可以创建一个名为 `constants` 的目录，并为每个模块创建一个单独的文件。例如：
```markdown
constants/
  - user.ts
  - role.ts

在这些文件中，你可以使用 const 或 readonly 属性来定义常量：

// constants/user.ts

export const USER_ROLE = 'user';

export const DEFAULT_USER_NAME = 'Guest';

  1. 在项目根目录下创建一个 utils 目录，并将一些工具函数和常量放在一起。这种方法适用于那些与特定功能相关的常量。

  2. 如果你的项目很大，可以根据功能模块对类型和常量进行分组。例如，在 auth 模块中创建一个名为 types.ts 和 constants.ts 的文件： “`markdown auth/

    • types.ts
    • constants.ts 5. 对于全局常量（如API端点），可以在项目根目录下的 `config.ts` 文件中定义它们： typescript // config.ts export const API_ENDPOINT = ‘https://api.example.com’; “`

总之，没有严格的规则来规定如何组织常量和类型定义。你可以根据项目的实际需求选择最适合的组织方式。关键是保持良好的代码结构，使其他开发人员能够轻松找到并理解相关代码。

我是Tony马12
  1. 组件内部最好不要定义任何常量
  2. 类型定义可以放在类似 modules文件夹下，比如： 
    src/store/modules/app.types.ts
  3. 将常量放在类似 utils文件夹下。 
    src/utils/validation.constant.ts

不过这都是看你项目规范来决定的。

LV真香12