如何在 Angular 5 中延迟加载外部模块？

Question

I'm trying to lazy load an external module (I wrote) into a main application, and I've got some errors, but first of all I wanted to ask you whether I have to build into /dist the external module first, or I have to use the source files?

Both main and external app/module are written with Angular 5

Error:

ERROR in Error: No NgModule metadata found for 'AppModule'.
    at NgModuleResolver.resolve (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:20291:23)
    at CompileMetadataResolver.getNgModuleMetadata (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:15244:60)
    at visitLazyRoute (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:31182:104)
    at AotCompiler.listLazyRoutes (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:31150:20)
    at AngularCompilerProgram.listLazyRoutes (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler-cli/src/transformers/program.js:156:30)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@angular/compiler-cli/src/ngtools_api.js:44:36)
    at AngularCompilerPlugin._getLazyRoutesFromNgtools (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:246:66)
    at Promise.resolve.then.then (/Users/me/Dev/Work/mobile-shop-frontend/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:537:50)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:160:7)

Answer 1

You have to write a wrapper module for this external module and then lazy load this wrapper module. Angular doesn't load external node modules as lazy module so I followed same approach