角2、角4、複数のプロジェクトで独自のコンポーネントライブラリを作成

Question

私はangular-cli（4）でコンポーネントを作成し、他のangular-cliプロジェクトで使用したいと考えています。

例：ダッシュボード・コンポーネント、グリッド...

質問1.誰かが簡単に教えてもらえます、私は準備できるか/（角-CLIで作られた）私のコンポーネント/モジュールを再利用しますか。？

その後、NPMで公開することができます。

Answer 1

コンポーネントとモジュールのセットを再利用する最も良い方法は、単にボイラープレートテンプレートを作ることです。 「ダッシュボード」と「アカウント」と「ナビゲーション」構造を追加すると、後で使用できるようにプロジェクトを貼り付けるコピーと同じように簡単になります。スペースを節約するためにnode_modulesフォルダ（およびそれがある場合はdistフォルダ）を削除してください。

• あなたはあなたのnode_modulesがあなたのpackage.jsonで
• を建て取得するnpm install最初のものを実行することになるでしょう：あなたは/コピー新しいプロジェクトのためのボイラープレートとして使用するために貼り付けると

  注意点あなたがプロジェクトの名前を変更したいファイル（ファイルの最上部）

• 余分な労力を必要とせずにgit repoに初期化することができます。

他のプロジェクトにモジュールやコンポーネントセットを追加する場合は、それらを手動で新しいプロジェクトにコピーして貼り付け、正しい場所にインポートする必要があります。これは、角型アプリ構造の基本知識があることを前提とした簡単なプロセスです。

Answer 2

私は最近、Angular Libraryのスターターを押しました。あなたはここにそれを見つけることができます：https://github.com/arunredhu/Angular-library-starter

Answer 3

私は自分のプロジェクトで再利用したいです。

私の指示：私のプロジェクトにフォルダへ

コピーdistのフォルダを構築する（この後は、NPMによってインストールされます

NPMの実行を

gitのクローンhttps://github.com/arunredhu/Angular-library-starter.git

1. NPMをインストール）

2. in .angular-cli私shared.module.tsで[ "./external_libraries/angular-library-starter/src/core-ui.module.js"]

3. 追加ライン：

   .json私は "スクリプト" を追加しました{CoreUIModule}を から './../../../external_libraries/angular-library-starter/dist/src/core-ui.module'にインポートします。

CoreUIModuleをインポートに追加します。

shared.moduleのエクスポートにCoreUIModuleを追加します。TS

Iを添加x.component.html で

：< APP-ヘッダ> </APP-ヘッダ>

1. NG役立つ

私はこのエラーを取得する：

WARNING in ./src/external_libraries/angular-library-starter/dist/src/core-ui.module.js 
(Emitted value instead of an instance of Error) Cannot find source file '../../src/core-ui.module.ts': Error: Can't resolve '../../src/core-ui.module.ts' in 'C:\Users\x\Documents\Visual Studio 2015\Projects\web\sr 
c\external_libraries\angular-library-starter\dist\src' 
@ ./src/app/modules/shared/shared.module.ts 84:0-109 
@ ./src/app/app.module.ts 
@ ./src/main.ts 
@ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts 

WARNING in ./src/external_libraries/angular-library-starter/dist/src/header/header.component.js 
(Emitted value instead of an instance of Error) Cannot find source file '../../../src/header/header.component.ts': Error: Can't resolve '../../../src/header/header.component.ts' in 'C:\Users\x\Documents\Visual Studio 2015\P 
/header/header.component.ts': Error: Can't resolve '../../../src/header/header.compon 
ent.ts' in 'C:\Users\x\Documents\Visual Studio 2015\Projects\web\src\ex 
ternal_libraries\angular-library-starter\dist\src\header' 
@ ./src/external_libraries/angular-library-starter/dist/src/core-ui.module.js 2:0-63 

私は間違って何をしていますか？

Iのみユーザの指示1、2、3、4場合、私はこのエラーを取得する：あなたの応答のための

Module not found: Error: Can't resolve 'C:\Users\x\Documents\Visual Studio 2015\Projects\web\src\external_libraries\angular-library-starter\src\core-ui.module.js' in 'C:\Users\x\Documents\Visual Studio 2015\Pr 
ojects\web\node_modules\@angular\cli\models\webpack-configs'