16

I'm using angular-cli-1.6.3 for bundling my project. I try to rename lazy loaded chunk name into valid module name. But it is not working. Code snippet given below,

{
  path: 'lazy',
  loadChildren: './lazy/module#LazyModule?chunkName=LazyModule'
}
Srigar
  • 1,648
  • 3
  • 14
  • 28

2 Answers2

24

you should be using -nc flag

ng build --aot -nc

or 

ng build --aot --named-chunks

Update 1 : Based on Comment

to remove the hash numbers set the --output-hashing to false as below

ng build --aot --nc --output-hashing=false

Documentation Link

Aravind
  • 40,391
  • 16
  • 91
  • 110
  • Throwing error like: ERROR in Error: LazyModule?chunkName=LazyModule is not an NgModule – Srigar Jan 29 '18 at 07:25
  • 1
    it simply created a file like "module.ebc4664b446ca766a851.chunk.js". But i want module name as file name or custom name. Do needful – Srigar Jan 29 '18 at 07:39
  • whats is the name of the module ? – Aravind Jan 29 '18 at 07:40
  • Module name: "LazyModule" – Srigar Jan 29 '18 at 07:41
  • `lazy.module.chunk.js` will be the file name created – Aravind Jan 29 '18 at 07:42
  • 1
    no it created like this only "module.ebc4664b446ca766a851.chunk.js". What to do? Im using angular-cli-1.6.3 – Srigar Jan 29 '18 at 07:46
  • what is the name of the file you have? it will be based on that! – Aravind Jan 29 '18 at 07:47
  • File name: module.ts – Srigar Jan 29 '18 at 07:50
  • 1
    Rename that too lazy.module.ts – Aravind Jan 29 '18 at 07:57
  • Yeah Its worked.. "lazy.module.e7e62921c478fc93d386.chunk.js". But is there any way to remove that hash code in the file name? Reason is, in future if i changed anything in that particular module, ill compile and replace the particular file alone. – Srigar Jan 29 '18 at 09:00
  • Thanks a lot you saved my time. – Srigar Jan 29 '18 at 09:07
  • But i didnt find any documentation like, that file name is related to chunk name. If you have any link please updated that in your Answer. – Srigar Jan 29 '18 at 09:08
  • Hey everyone! The chunks have hashes for a reason. What if you update your app and people still have it open? They'll get the OLD compatible hashed file instead of loading a new file with the same name that may not be compatible. If you have files on a CDN they may get cached too - so having unique filenames per version is much safer. – Simon_Weaver Sep 03 '19 at 19:01
5
 ng build --namedChunks=true --outputHashing=none --vendorChunk=true
  • namedChunks Use file name for lazy loaded chunks
  • output-hashing Define the output filename cache-busting hashing mode.
  • vendorChunk Use a separate bundle containing only vendor libraries.
double-beep
  • 5,031
  • 17
  • 33
  • 41
ElasticCode
  • 7,311
  • 2
  • 34
  • 45