2016-05-25 16 views
0

私は、論理的に2つの部分に分けられたプロジェクトを持っています。Angular2とWebpackのモジュール構造

私の構造があります:

  • 不正なサービス
  • app.component.ts
  • vendor.ts
  • boot.ts

を許可app.co mponent:

@Component({ 
       selector : "body", 
       template : `<router-outlet></router-outlet>`, 
       directives: [ROUTER_DIRECTIVES], 
       providers : [AuthService, DefaultService, LoggerService] 
      }) 
@Routes([ 
      { 
       path  : "/auth/login", 
       component: AuthComponent 
      }, 
      { 
       path  : "/", 
       component: DefaultComponent 
      } 
     ]) 
export class AppComponent {} 

私は、権限のない権限のあるモジュールを分離してカプセル化したいと思っています。 ディレクトリサービスは両方のモジュールで共通です(ログなど) Webpackを使用しました。

Webpackが別のモジュールをロードする必要があると知ったように、app.componentをどのようにリメイクするのですか?

entry: { 
      "vendors": "./project/app/vendors.ts", 
      "auth" : "./project/app/unauthorized/auth.component.ts", 
      "unauth" : "./project/app/authorized/default.component.ts", 
      "style" : "./project/sass/application.scss" 
     } 

プラグイン::webpack.config.jsから

ビルド後

new CommonsPlugin({ 
    minChunks: Infinity, 
    name  : "common", 
    chunks : [ 
     "vendors", 
     "auth", 
     "unauth" 
    ] 
}) 

私は4つのファイルを持っている:

- auth.js 
- unauth.js 
- vendors.js 
- common.js 

共通するのは、唯一、ベンダーが持つデフォルトのWebPACKの構造を有していますすべてのベンダーがコードします。 しかし、auth.jsとunauth.jsにはtheireコードだけでなく、vendors2.jsにあるangle2構造のほとんどすべてがあります。

答えて

0

2つの別々のアプリケーションを作成することをお勧めします。ユーザーがログインすると、ログインしたアプリにリダイレクトされます。ユーザーがログアウトすると、ログアウトしたアプリにリダイレクトされます。

私はルーティング付きの角度1のログインでモノリシックアプリをやっていました。それは悪夢でした。角度2のほうが良いかもしれませんが、単に分割するほうがずっと複雑です。

+0

Webpackが他のファイルを読み込めないことは確かですか? – Illorian

関連する問題