Skip to content

Commit 1db431c

Browse files
committed
docs: Encourage the use of type-only imports
1 parent 952ec83 commit 1db431c

File tree

1 file changed

+12
-6
lines changed

1 file changed

+12
-6
lines changed

docs/ember-data/models.md

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,13 @@ export default class User extends Model {
5858
}
5959
```
6060

61-
## `@belongsTo`
61+
## Relationships
62+
63+
Relationships between models in Ember Data rely on importing the related models, like `import User from './user';`. This, naturally, can cause a recursive loop, as `/app/models/post.ts` imports `User` from `/app/models/user.ts`, and `/app/models/user.ts` imports `Post` from `/app/models/post.ts`. Recursive importing triggers an [`import/no-cycle`](https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/no-cycle.md) error from eslint.
64+
65+
One should be certain to make use of [type-only imports](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html), available since TypeScript 3.8, and write `import type User from './user';`.
66+
67+
### `@belongsTo`
6268

6369
The type returned by the `@hasMany` decorator depends on whether the relationship is `{ async: true }` \(which it is by default\).
6470

@@ -70,8 +76,8 @@ So, for example, you might define a class like this:
7076
```typescript
7177
import Model, { belongsTo } from '@ember-data/model';
7278
import DS from 'ember-data'; // NOTE: this is a workaround, see discussion below!
73-
import User from './user';
74-
import Site from './site';
79+
import type User from './user';
80+
import type Site from './site';
7581

7682
export default class Post extends Model {
7783
@belongsTo('user')
@@ -89,7 +95,7 @@ These are _type_-safe to define as always present, that is to leave off the `?`
8995

9096
Note, however, that this type-safety is not a guarantee of there being no runtime error: you still need to uphold the contract for non-async relationships \(that is: loading the data first, or side-loading it with the request\) to avoid throwing an error!
9197

92-
## `@hasMany`
98+
### `@hasMany`
9399

94100
The type returned by the `@hasMany` decorator depends on whether the relationship is `{ async: true }` \(which it is by default\).
95101

@@ -102,8 +108,8 @@ So, for example, you might define a class like this:
102108
import Model, { hasMany } from '@ember-data/model';
103109
import EmberArray from '@ember/array';
104110
import DS from 'ember-data'; // NOTE: this is a workaround, see discussion below!
105-
import Comment from './comment';
106-
import User from './user';
111+
import type Comment from './comment';
112+
import type User from './user';
107113

108114
export default class Thread extends Model {
109115
@hasMany('comment')

0 commit comments

Comments
 (0)