Anglar 2.x/Typeescriptモジュール導入解析

まず、モジュールを導入する時は2つの方法があります.

import Entry from "./components/Entry";
import { DefaultHeaders } from "../constants/http";
import "/mod";

解析時に導入されたファイルに対して、外部モジュール宣言として解析することはできません.あなたが自分で書いたモジュールに対して相対的に導入するべきです.これは動作中の相対的な位置を確保することができます.
2、非相対導入:

import * as $ from "jQuery";
import { Component } from "@angular/core";

非相対モジュールの導入は、baseUrlに対して行うことができます.https://www.tslang.cn/docs/handbook/module-resolution.html )または以下に述べる経路マップにより解析します.それらはまた、外部モジュールサウンドに解析され、非相対パスを使用して、あなたの外部依存またはプロジェクトの公開ライブラリ(Anglar 8後にプロジェクトを作成し、デフォルトでは複数のプロジェクトが統合されたworkspaceであり、プロジェクト間のより友好的なアクセス)を導入することができます.
私たちはimportの後、Angular 2.x/Typeescriptはどうやって解析して私たちのモジュールを見つけましたか?
例えば、相対的に導入されている導入文の一つであるimport｛b｝from「./moduleB」があります./root/src/moduleA.tsでは、以下の流れで「./moduleB」と位置づけられます.

/root/src/moduleB.ts
/root/src/moduleB.tsx
/root/src/moduleB.d.ts
/root/src/moduleB/package.json (     "types"  )
/root/src/moduleB/index.ts
/root/src/moduleB/index.tsx
/root/src/moduleB/index.d.ts

まず同じレベルのディレクトリの下でmoduleB-」moduleBの声明ファイル(.d.ts)を探します.もし見つけられなかったら、同じレベルのディレクトリの下のmoduleBディレクトリを探します.その下のpackages.json-)index-index声明ファイルはもちろん、これらのファイルの中にbモジュールのexport文があります.
もう一つの非相対導入は、import｛b｝from“moduleB”が/root/src/moduleA.tsの中で、以下の流れで「./moduleB」と位置づけられます.

/root/src/node_modules/moduleB.ts
/root/src/node_modules/moduleB.tsx
/root/src/node_modules/moduleB.d.ts
/root/src/node_modules/moduleB/package.json (     "types"  )
/root/src/node_modules/moduleB/index.ts
/root/src/node_modules/moduleB/index.tsx
/root/src/node_modules/moduleB/index.d.ts

/root/node_modules/moduleB.ts
/root/node_modules/moduleB.tsx
/root/node_modules/moduleB.d.ts
/root/node_modules/moduleB/package.json (     "types"  )
/root/node_modules/moduleB/index.ts
/root/node_modules/moduleB/index.tsx
/root/node_modules/moduleB/index.d.ts

/node_modules/moduleB.ts
/node_modules/moduleB.tsx
/node_modules/moduleB.d.ts
/node_modules/moduleB/package.json (     "types"  )
/node_modules/moduleB/index.ts
/node_modules/moduleB/index.tsx
/node_modules/moduleB/index.d.ts

ここで注意してください.一級ずつネットで探します.全部node_にあります.modulesの中で、このディレクトリはnode npmのパッケージ管理ディレクトリです.
以下では具体的な例を見て、異なった方式の公共倉庫の導入を実現します.私達はハロープロジェクトを持っています.下にはsrcがあります.下にservicesがあります.そして下にハロー.tsがあります.それから、共通のライブラリのCommonとHelloディレクトリが同じです.下にservicesがあります.そして下にCommon.ts(Commonの中でexportがあります.CommonとCommon 1の二つのモジュール)があります.Hello.tsにCommonライブラリを導入するには、次のようないくつかの方法があります.
最も原始的な方式:import { Common, Common1 } from '../../../Common/services/Common'; Commonで一つのindex.tsの中にexport*from'/services/Common'があると定義した場合.この場合は、以下の文でimport { Common, Common1 } from '../../../Common';を使用することができます.
しかし、このような相対的に導入されたライブラリファイルの方式には問題があります.このCommonフォルダの位置が移動すると、importはそれに対応する変更を行う必要があります.相対的な参照は現在の参照ファイルの位置によるものですので、非相対的な導入を考えてみます.import{Common 1}from'common'このような方式を採用するには、tsconfig.tsにpathsディレクトリを配置して、プログラムにcomonがどこで探しているかを知る必要があります.

compilerOptions: {
        ...
    "baseUrl": "./", //  baseUrl tsconfig.ts   
        "paths": {     
      "common": [
        "../common"
      ],
      "common/*": [
        "../common/*" //         "baseUrl"
      ]
    }
}