You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+11-11Lines changed: 11 additions & 11 deletions
Original file line number
Diff line number
Diff line change
@@ -314,11 +314,11 @@ We need to create a container instance for holding all registered injections. We
314
314
315
315
```js
316
316
import { Container } from'inversify';
317
-
let container =newContainer();
317
+
constcontainer=newContainer();
318
318
exportdefaultcontainer;
319
319
```
320
320
321
-
and then just execute it in the bootstrap phase of the application:
321
+
and then just execute it in the application bootstrap:
322
322
323
323
```js
324
324
import'./di';
@@ -339,7 +339,7 @@ export default class AuthService {
339
339
```js
340
340
import { Container } from'inversify';
341
341
importAuthServicefrom'services/auth';
342
-
let container =newContainer();
342
+
constcontainer=newContainer();
343
343
container.bind('authService').to(AuthService);
344
344
exportdefaultcontainer;
345
345
```
@@ -361,7 +361,7 @@ class LoginView extends Vue {
361
361
362
362
There are a couple of issues with this approach:
363
363
364
-
1. If we register all our services in `di.js`, then we nullified the code splitting because everything is required during the application bootstrap. To solve this issue, let's register service into the container only when is required for the first time:
364
+
1. If we register all our services in `di.js`, then we nullified the code splitting because everything is required during the application bootstrap. To solve this issue, let's register a service into the container only when it is required for the first time:
365
365
366
366
```js
367
367
importcontainerfrom'./di';
@@ -415,7 +415,7 @@ Decorators can help us to eliminate lots of code repetition and make our code cl
415
415
416
416
#### @Register decorator
417
417
418
-
The @Register() decorator is just a syntactic sugar for registering classes to the container. In Typescript, you would have `@injectable` and `@inject` decorators available, but this project is not using TS, it's plain JS. The maintainers of InversifyJS have provided another set of decorators/helpers called [inversify-vanillajs-helpers](https://github.com/inversify/inversify-vanillajs-helpers), for using inversify without TS. They just need a unique identifier for each registered class, because they cannot tell which parameter in constructor belongs to which registered class.
418
+
The @Register() decorator is just a syntactic sugar for registering classes to the container. In Typescript, you would have `@injectable` and `@inject` decorators available, but this project is not using TS, it's plain JS. The InversifyJS maintainers have provided another set of decorators/helpers called [inversify-vanillajs-helpers](https://github.com/inversify/inversify-vanillajs-helpers), for using inversify without TS. They just need a unique identifier for each registered class, because they cannot tell which parameter in constructor belongs to which registered class.
419
419
420
420
Let's have classes defined as:
421
421
@@ -443,7 +443,7 @@ container.bind("c").to(C);
443
443
container.bind("b").to(B);
444
444
container.bind("a").to(A);
445
445
446
-
let c =container.get("c");
446
+
constc=container.get("c");
447
447
console.log(c instanceofC); // true
448
448
```
449
449
@@ -459,11 +459,11 @@ container.bind("a").to(A);
459
459
In TS, this is done by `@injectable` and `@inject` decorators automatically. Doing this for every class in your project would be annoying, so let's use rather a vanillajs helper:
460
460
461
461
```js
462
-
let register =helpers.register(container);
462
+
constregister=helpers.register(container);
463
463
register("a", ["b", "c"])(A);
464
464
```
465
465
466
-
^^ this helper called `register` is now coupled with the container and does exactly the same thing as a previous example. And the helper can also be used as a decorator:
466
+
^^ this helper called `register` is now coupled with the container and does exactly the same thing as the previous example, and the helper can also be used as a decorator:
467
467
468
468
```js
469
469
@register("a", ["b", "c"])
@@ -472,7 +472,7 @@ class A {
472
472
}
473
473
```
474
474
475
-
... is equivalent of calling:
475
+
... is equivalent to:
476
476
477
477
```js
478
478
register("a", ["b", "c"])(
@@ -486,8 +486,8 @@ In this project, the decorators are defined in `di.js`:
export { registerasRegister } // we are exporting decorator with capital R because other decorators we are already using (e.g. for Vuex) also have a capital letter
0 commit comments