0

Angular Package Format 4.0仕様に従ってngcとrollupを使用して角モジュールをパッケージ化しています。Angular Package Format仕様に準拠して遅延ロードモジュールをパッケージ化する方法はありますか?

ラッパーモジュールを使用して角度cliを使用して遅延ロードすることができます。

import { LibraryModule } from 'my-library'; 
import { NgModule } from '@angular/core'; 
@NgModule({ 
    imports: [LibraryModule], 
    exports: [LibraryModule] 
}) 
export class WrapperModule { } 

...

RouterModule.forRoot([ 
    { 
    path: 'todolist', 
    loadChildren: './wrapper.module#WrapperModule' 
    }], 

ライブラリモジュールはまた、サブルートが含まれています。私のように、これらのサブルートの1つを定義する場合:

{ 
    path: 'foo', 
    loadChildren: '../foo/foo.module#FooModule' 
} 

私は、CLIのコンパイラエラーを取得:私はindex.jsで怠惰なロードされたモジュールを輸出しようとした

ERROR in Error: Could not resolve module ../foo/foo.module relative to C:/Workspace/test-app/node_modules/my-library/my-library.d.ts 
    at StaticSymbolResolver.getSymbolByModule (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:31826:30) 
    at StaticReflector.resolveExternalReference (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:30292:62) 
    at parseLazyRoute (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:28577:55) 
    at listLazyRoutes (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:28539:36) 
    at visitLazyRoute (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:29937:47) 
    at visitLazyRoute (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:29941:17) 
    at AotCompiler.listLazyRoutes (C:\Workspace\test-app\node_modules\@angular\compiler\bundles\compiler.umd.js:29905:20) 
    at AngularCompilerProgram.listLazyRoutes (C:\Workspace\test-app\node_modules\@angular\compiler-cli\src\transformers\program.js:157:30) 
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (C:\Workspace\test-app\node_modules\@angular\compiler-cli\src\ngtools_api.js:44:36) 
    at AngularCompilerPlugin._getLazyRoutesFromNgtools (C:\Workspace\test-app\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:246:66) 
    at Promise.resolve.then.then (C:\Workspace\test-app\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:542:50) 
    at process._tickCallback (internal/process/next_tick.js:109:7) 

、私も含めましたこれはtsconfig.jsonファイルの配列にあります。

他の手がかりはありますか?

{ 
    path: 'foo', 
    loadChildren: 'app/foo/foo.module#FooModule' 
} 

あなたの実際のフルパスこの異なることが、CLIアプリケーションでのappフォルダから始まることが重要である可能性があります

答えて

0

遅延ロードパスを持つあなたのルートはそうは次のように、アプリのルートから開始する必要があります。相対パスは機能しません。エラーの情報に基づいて、CLI(ng serve)は相対パスを解決できません。

+0

、それは他のアプリケーションで再利用される可能性があるので、私はそれがアプリケーションのルートについて何を知っている必要はありません。 –

+0

さて、ラッパーモジュールの遅延ロードを変更する必要があるかもしれません。 –

0

webpackまたは@ angular/cliを使用している場合は、ng-router-loaderを使用して、遅延ロードされたモジュールが正しくバンドルされていることを確認できます。

npm install ng-router-loader --save-dev; 

この副経路は、ライブラリで定義されているwebpack.config.js

{ 
    test: /\.ts$/, 
    use: [ 
     { 
      loader: 'ng-router-loader', 
      options: { 

      } 
     }, 
     { 
      loader: '@ngtools/webpack', 
      options: { 
       tsConfigPath: './tsconfig.json' 
      } 
     } 
    ] 
}, 
関連する問題