Angular2 WebアプリケーションおよびWebpackと共に共有角度2コンポーネントを使用するにはどうすればよいですか？

Question

共有角度2コンポーネントを別の角度2 Webプロジェクトのnode_modulesフォルダにコピーして使用しようとしています。残念ながら、それは動作していません。

あなたはNg2-Webpack-Webpack

問題のシナリオでは、プロジェクト全体を見ることができるが、以下のように私は2つのプロジェクト、Angular2SpaとAngular2-CDNを持って

です。

Angular2-CDNは、角度成分と認証ダミーチェックのための警備員など

現在、私が実装した私のauth.guard.tsを共有しています。

auth.guard.ts

import { Inject, Injectable } from '@angular/core'; 
import { CanActivate, Router, ActivatedRoute } from '@angular/router'; 
import { tokenNotExpired, AuthConfig } from 'angular2-jwt'; 

@Injectable() 
export class AuthGuard implements CanActivate { 
    publicRoutes: any; 

    constructor(@Inject(Router) private _router: Router, 
     @Inject(ActivatedRoute) private _activatedRoute: ActivatedRoute) { 

     this.publicRoutes = { 
      'login': true 
     }; 
    } 

    canActivate() { 
     console.log("Activated Route"); 

     return true; 
    } 
} 

私はAngular2Spaのnode_modules /共有にゴクゴクタスクを経由して、このファイルをコピーしています。

gulp.file

/// <binding BeforeBuild='typescript:compile' AfterBuild='module:copy' /> 

var gulp = require('gulp'); 
var path = require('path'); 
var ts = require('gulp-typescript'); 
var sourcemaps = require('gulp-sourcemaps'); 

var paths = {}; 
paths.webroot = path.join(__dirname, 'wwwroot'); 
paths.app = path.join(paths.webroot, 'app'); 
paths.ng2App = path.join(__dirname, '..', 'Angular2Spa'); 
paths.ng2AppShared = path.join(paths.ng2App, 'node_modules', 'shared'); 

gulp.task('module:copy', function() { 
    return gulp.src([ 
      path.join(paths.app, '**') 
     ]) 
     .pipe(gulp.dest(paths.ng2AppShared)); 
}); 

gulp.task('typescript:compile', function() { 
    var tsProject = ts.createProject({ 
     target: 'es5', 
     moduleResolution: 'node', 
     experimentalDecorators: true, 
     emitDecoratorMetadata: true 
    }); 

    return gulp.src([ 
     path.join(paths.app, '**/*.ts') 
    ]) 
    .pipe(sourcemaps.init()) 
    .pipe(ts(tsProject)) 
    .pipe(sourcemaps.write()) 
    .pipe(gulp.dest(paths.app)); 
}); 

問題私はWebPACKのを使用して、私のAngular2Spaプロジェクトにauth.guard使用したい場合に発生します。

カウンター（ビュー）に移動しながらは、それが失敗したと

AuthGuardなしプロバイダのエラーを投げます！私のクエリがある

、

はNode_modulesにそれらをコピーせずに別のWebPACKのとAngular2ウェブアプリに共有コンポーネントを使用するために任意のより良い方法はありますか？またはこの共有コンポーネントの問題を解決する方法は？

あなたのご意見やご提案は非常に高いです！

ありがとうございました。

Answer 1

はい別の方法があります。npm linkです。コピー＆ペーストの代わりにnpmリンクを使用して、あるプロジェクトを別のプロジェクトに結び付けます。 Googleのnpmのリンクとドキュメントに従うと、探しているものが見つかります。