Skip to content

Lazy loaded file using a string from ./src does not generate chunk with --aot #4156

Closed

Description

@filipesilva

Having an empty src/lazy-file.ts and the following code in main.ts (or in any other file, adjusting the relative path):

// verify other System.import still work
declare var System: any;
const lazyFile = 'file';
System.import('./lazy-' + lazyFile);

Running ng build --aot will not generate the lazy loaded chunk 0.chunk.js. This chunk is generated in non-aot mode, and is also generated if lazy-file.ts is in any other directory than .src/.

Using System.import('./lazy-file.ts'); also works.

Note: System.import is only available after #4153 is merged.

Activity

  1. changed the title [-]Lazy load a file using a string from ./src does not generate chunk with --aot[/-] [+]Lazy loaded file using a string from ./src does not generate chunk with --aot[/+] on Jan 24, 2017
  2. sumitarora commented on Feb 9, 2017

    @sumitarora
    Contributor

    Tested on the current build for AngularCli

    @angular/cli: 1.0.0-beta.30
    node: 7.5.0
    os: darwin x64
    @angular/common: 2.4.7
    @angular/compiler: 2.4.7
    @angular/core: 2.4.7
    @angular/forms: 2.4.7
    @angular/http: 2.4.7
    @angular/platform-browser: 2.4.7
    @angular/platform-browser-dynamic: 2.4.7
    @angular/router: 3.4.7
    @angular/cli: 1.0.0-beta.30
    @angular/compiler-cli: 2.4.7

    With 3 lazy loaded files as shown below and doing ng build --aot chunks are generated as desired.

    image

    Code in Main.ts

    // verify other System.import still work
    declare var System: any;
    const lazyFile = 'file';
    System.import('./lazy-' + lazyFile);
    System.import('./lazy-file2.ts');
    System.import('./app/lazy-file3.ts');
    

    Build Output:

     ~/w/o/t/test-project   master *…  ng build --aot                                                                                                      Thu  9 Feb 12:36:54 2017
    fallbackLoader option has been deprecated - replace with "fallback"
    loader option has been deprecated - replace with "use"
    fallbackLoader option has been deprecated - replace with "fallback"
    loader option has been deprecated - replace with "use"
    fallbackLoader option has been deprecated - replace with "fallback"
    loader option has been deprecated - replace with "use"
    fallbackLoader option has been deprecated - replace with "fallback"
    loader option has been deprecated - replace with "use"
    Hash: e6b6eb13d3a1f51f3cd5
    Time: 4818ms
    chunk    {0} 0.chunk.js, 0.bundle.map 100 bytes {4} [rendered]
    chunk    {1} 1.chunk.js, 1.bundle.map 99 bytes {4} [rendered]
    chunk    {2} 2.chunk.js, 2.bundle.map 100 bytes {4} [rendered]
    chunk    {3} polyfills.bundle.js, polyfills.bundle.map (polyfills) 147 kB {7} [initial] [rendered]
    chunk    {4} main.bundle.js, main.bundle.map (main) 27.9 kB {6} [initial] [rendered]
    chunk    {5} styles.bundle.js, styles.bundle.map (styles) 10 kB {7} [initial] [rendered]
    chunk    {6} vendor.bundle.js, vendor.bundle.map (vendor) 1.16 MB [initial] [rendered]
    chunk    {7} inline.bundle.js, inline.bundle.map (inline) 0 bytes [entry] [rendered]
     ~/w/o/t/test-project   master *…  cd dist/                                                                                                     8.2s  Thu  9 Feb 12:37:04 2017
     ~/w/o/t/test-project   master *  dist  ls -l                                                                                                         Thu  9 Feb 12:38:06 2017
    total 6728
    -rw-r--r--  1 sumitarora  staff      107  9 Feb 12:37 0.bundle.map
    -rw-r--r--  1 sumitarora  staff      218  9 Feb 12:37 0.chunk.js
    -rw-r--r--  1 sumitarora  staff      107  9 Feb 12:37 1.bundle.map
    -rw-r--r--  1 sumitarora  staff      217  9 Feb 12:37 1.chunk.js
    -rw-r--r--  1 sumitarora  staff      107  9 Feb 12:37 2.bundle.map
    -rw-r--r--  1 sumitarora  staff      218  9 Feb 12:37 2.chunk.js
    -rw-r--r--  1 sumitarora  staff     5430  9 Feb 12:37 favicon.ico
    -rw-r--r--  1 sumitarora  staff      614  9 Feb 12:37 index.html
    -rw-r--r--  1 sumitarora  staff     5761  9 Feb 12:37 inline.bundle.js
    -rw-r--r--  1 sumitarora  staff     5824  9 Feb 12:37 inline.bundle.map
    -rw-r--r--  1 sumitarora  staff    41923  9 Feb 12:37 main.bundle.js
    -rw-r--r--  1 sumitarora  staff    42069  9 Feb 12:37 main.bundle.map
    -rw-r--r--  1 sumitarora  staff   157697  9 Feb 12:37 polyfills.bundle.js
    -rw-r--r--  1 sumitarora  staff   192668  9 Feb 12:37 polyfills.bundle.map
    -rw-r--r--  1 sumitarora  staff    10302  9 Feb 12:37 styles.bundle.js
    -rw-r--r--  1 sumitarora  staff    13888  9 Feb 12:37 styles.bundle.map
    -rw-r--r--  1 sumitarora  staff  1386116  9 Feb 12:37 vendor.bundle.js
    -rw-r--r--  1 sumitarora  staff  1524998  9 Feb 12:37 vendor.bundle.map
  3. angular-automatic-lock-bot commented on Sep 6, 2019

    @angular-automatic-lock-bot

    This issue has been automatically locked due to inactivity.
    Please file a new issue if you are encountering a similar or related problem.

    Read more about our automatic conversation locking policy.

    This action has been performed automatically by a bot.

  4. locked and limited conversation to collaborators on Sep 6, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions