Add Japanese document (#1186)

* Fixed invalid url link. * Update docs/features/side-navigation.md Co-Authored-By: Suzana Dirla <dirla.silvia.suzana@gmail.com> * Initial japanese translation.
2026-09-09 18:02:54 +00:00 · 2019-09-10 14:46:48 +03:00
parent 21ffcaf013
commit d67f95cfff
66 changed files with 3974 additions and 0 deletions
@@ -0,0 +1,222 @@
+---
+Title: 再配布可能なライブラリ
+---
+
+# 再配布可能なライブラリ
+
+拡張ライブラリは、JSON 形式の標準の Angular ライブラリと定義ファイルに基づいています。
+
+詳細については、次の記事をご覧ください: [Angular CLI 6のライブラリサポート](https://github.com/angular/angular-cli/wiki/stories-create-library#library-support-in-angular-cli-6)
+
+あわせて参照
+
+- Angular Library Series - Angular CLI を使用したライブラリの作成
+  - Part 1: https://blog.angularindepth.com/creating-a-library-in-angular-6-87799552e7e5
+  - Part 2: https://blog.angularindepth.com/creating-a-library-in-angular-6-part-2-6e2bc1e14121
+
+## 拡張ライブラリの作成
+
+最初に、ワークスペース内で新しいプロジェクトを生成します:
+
+```sh
+ng generate library my-extension
+```
+
+`projects/my-extensions` フォルダに新しいプロジェクトを取得します。
+デフォルトでは、プロジェクトには少なくとも次のコンテンツが含まれています:
+
+- Example component `my-extension.component.ts`
+- Example service `my-extension.service.ts`
+- Angular Module example `my-extension.module.ts`
+
+次に、次のコマンドでプロジェクトをビルドします:
+
+```sh
+ng build my-extension
+```
+
+Angular CLI は、プロジェクトの Typescript パスマッピングを自動的に構成するため、ライブラリをリンクするための追加手順は必要ありません。
+
+### 動的コンポーネントを登録する
+
+`my-extension.module.ts` を更新し、実行時に動的に使用する予定のすべてのコンテンツをモジュールの `entryComponents` セクションに配置します。
+
+```typescript
+@NgModule({
+  imports: [],
+  declarations: [MyExtensionComponent],
+  exports: [MyExtensionComponent],
+  entryComponents: [MyExtensionComponent]
+})
+export class MyExtensionModule {}
+```
+
+ここで、`MyExtensionComponent` を拡張コンポーネントとして登録する必要があります。
+次の例のようにコードを更新します:
+
+```typescript
+import { ExtensionService } from '@alfresco/adf-extensions';
+
+@NgModule({...})
+export class MyExtensionModule {
+    constructor(extensions: ExtensionService) {
+        extensions.setComponents({
+            'my-extension.main.component': MyExtensionComponent,
+        });
+    }
+}
+```
+
+`MyExtensionComponent` を参照する場合、
+JSON 定義で `my-extension.main.component` 識別子を使用できるようになりました。
+
+### プラグイン定義ファイル
+
+ライブラリプロジェクトのルートフォルダに次の内容の新しい `assets/my-extension.json` ファイルを作成します:
+
+```json
+{
+  "$schema": "../../../extension.schema.json",
+  "$version": "1.0.0",
+  "$name": "plugin1",
+  "$description": "demo plugin",
+
+  "routes": [
+    {
+      "id": "my.extension.route",
+      "path": "ext/my/route",
+      "component": "my-extension.main.component"
+    }
+  ],
+
+  "features": {
+    "navbar": [
+      {
+        "id": "my.extension.nav",
+        "items": [
+          {
+            "id": "my.extension.main",
+            "icon": "extension",
+            "title": "My Extension",
+            "route": "my.extension.route"
+          }
+        ]
+      }
+    ]
+  }
+}
+```
+
+ルートの `package.json` ファイルを更新し、`scripts` セクションに次のエントリを追加します:
+
+```json
+{
+    "scripts": {
+        ...,
+
+        "build:my-extension":
+            "ng build my-extension && cpr projects/my-extension/assets dist/my-extension/assets --deleteFirst"
+    }
+}
+```
+
+このスクリプトを使用して、ライブラリを構築し、アセットをアウトプットフォルダにコピーできるようになりました。
+
+**Tip:** ライブラリのインストール手順を `README.md` ファイルで提供することをお勧めします。
+プラグイン定義ファイルをメインアプリケーションの `assets/plugins` フォルダにコピーするビルドルールが開発者に必要であることを忘れないでください。
+
+## NPM へのライブラリの公開
+
+公開する前に、常にライブラリを再構築する必要があります:
+
+```sh
+npm run build:my-extension
+```
+
+アウトプットフォルダに移動し、publish コマンドを実行します。
+
+```sh
+cd dist/my-extension
+npm publish
+```
+
+注: 有効な [NPM](https://www.npmjs.com/) アカウントが必要です。
+
+詳細については、[ライブラリの公開](https://github.com/angular/angular-cli/wiki/stories-create-library#publishing-your-library) の記事をご覧ください。
+
+## 拡張ライブラリの使用
+
+拡張ライブラリを NPM に公開していると仮定すると、標準コマンドを使用してインストールできます:
+
+```sh
+npm install my-extension
+```
+
+これにより、ライブラリとそのすべての依存関係がインストールされます。
+
+**注:** アプリケーションはすでに `dist` フォルダのローカルバージョンを使用するように設定されているため、元のワークスペースにライブラリをインストールする必要はありません。
+
+### アセットをコピーする
+
+同じワークスペースで拡張ライブラリを開発およびテストする場合は、`angular.json` 設定ファイルを編集し、次のルールを追加します。
+
+```json
+{
+  "glob": "**/*.json",
+  "input": "dist/my-extension/assets",
+  "output": "/assets/plugins"
+}
+```
+
+NPM から拡張機能をインストールする場合は、次のルールを使用します:
+
+```json
+{
+  "glob": "**/*.json",
+  "input": "node_modules/my-extension/assets",
+  "output": "/assets/plugins"
+}
+```
+
+### モジュールの登録
+
+メインアプリケーションで、`src/app/extensions.module.ts` ファイルを編集し、次の例のようにモジュール宣言を追加します:
+
+```typescript
+...
+import { MyExtensionModule } from 'my-extension';
+
+@NgModule({
+    ...
+    imports: [
+        ...,
+        MyExtensionModule
+    ]
+})
+export class AppExtensionsModule {}
+```
+
+### プラグインの登録
+
+最後に、`assets/app.extensions.json` ファイルを更新し、新しいプラグインへの参照を追加します:
+
+```json
+{
+    "$references": [
+        ...,
+        "my-extension.json"
+    ]
+}
+```
+
+## ライブラリのテスト
+
+アプリケーションを実行し、追加のナビゲーションサイドバーエントリがあることを確認します:
+
+```sh
+npm start
+```
+
+`My Extension` リンクをクリックすると、メインコンテンツ領域にライブラリからの拡張機能コンポーネントが表示されます。
+
+**Note:** アプリケーションの設定によっては、`admin` ユーザーが利用できる `Settings` ダイアログ (アプリケーションプロファイルボタンをクリックします) を介して外部プラグインを有効にする必要がある場合があります。