@@ -343,7 +343,7 @@ a#toh
343
343
344
344
***index.html***
345
345
346
- The JiT and AoT apps are setup and launched so differently that they require their own `index.html` files.
346
+ The JiT and AoT apps require their own `index.html` files because they setup and launch so differently .
347
347
Here they are for comparison:
348
348
349
349
+ makeTabs(
@@ -355,7 +355,8 @@ a#toh
355
355
)
356
356
357
357
:marked
358
- They can't be in the same folder.
358
+ They can't be in the same folder.
359
+
359
360
***Put the AoT version in the `/aot` folder***.
360
361
361
362
The JiT version relies on `SystemJS` to load individual modules and requires the `reflect-metadata` shim.
@@ -366,8 +367,8 @@ a#toh
366
367
367
368
***main.ts***
368
369
369
- The JiT and AoT apps are also bootstraped differently that they require their own `main.ts` files.
370
- Here they are for comparison:
370
+ JiT and AoT apps boot in much the same way but require different Angular libraries to do so.
371
+ The differences are evident in these `main` files:
371
372
372
373
+ makeTabs(
373
374
` toh-6/ts/app/main-aot.ts,
@@ -378,17 +379,17 @@ a#toh
378
379
)
379
380
380
381
:marked
381
- They can and should exist in the same folder.
382
+ Both `main` files can and should exist in the same folder.
382
383
383
384
The `app/main-aot.ts` file is used by the AoT config scripts (`tsconfig-aot.json` and `rollup-config.js`).
384
385
385
- Key differences are discussed in the [Bootstrap](#bootstrap) section, above.
386
+ The [Bootstrap](#bootstrap) section, above covers the key differences .
386
387
387
- *Component-relative Template URLS*
388
+ *** Component-relative Template URLS** *
388
389
389
390
The AoT compiler requires that `@Component` URLS for external templates and css files be _component-relative_.
390
- That means that the value of `@Component.templateUrl` is a URL value relative to the component class file:
391
- ` foo.component.html` no matter where `foo.component.ts` sits in the project folder structure .
391
+ That means that the value of `@Component.templateUrl` is a URL value _relative_ to the component class file.
392
+ The URL, `' foo.component.html'`, means that the template file is a sibling of its companion `foo.component.ts` file .
392
393
393
394
While JiT app URLs are more flexible, stick with _component-relative_ URLs for compatibility with AoT compilation.
394
395
@@ -418,10 +419,13 @@ a#toh
418
419
419
420
.l-sub-section
420
421
:marked
421
- _Note_ that the specific file structure of this project needs `typeRoots` to include `../../node_modules/@types/`,
422
- whereas in a typical setting it should include `node_modules/@types/` instead.
422
+ The file structure of this specific sample project
423
+ happens to place the `node_modules` two levels up from the project root.
424
+ Therefore, `typeRoots` must be `../../node_modules/@types/`.
425
+ In a more typical project, `node_modules` would be a sibling of tsconfig-aot.json`
426
+ and `typeRoots` would be `node_modules/@types/`.
423
427
424
- Make sure to edit accordingly to your project needs .
428
+ Edit your `tsconfig-aot.json` to fit your project's file structure .
425
429
426
430
:marked
427
431
### Tree Shaking
0 commit comments