web-dev-qa-db-ja.com

Angular 8-遅延読み込みモジュール：エラーTS1323：動的インポートは、「-module」フラグが「commonjs」または「esNext」の場合にのみサポートされます

Angularを7からAngular 8に更新すると、遅延読み込みモジュールでエラーが発生します

私はangularアップグレードガイドにあるオプションを試しました

以下の変更を行いました：

変更前

    loadChildren: '../feature/path/sample- 
                         tage.module#SameTagModule'

後

   loadChildren: () => import('../feature/path/sample- 
                      tags.module').then(m => m.CreateLinksModule)

エラーTS1323：動的インポートは、「-module」フラグが「commonjs」または「esNext」の場合にのみサポートされます。

javascriptangulartypescriptmoduleangular8
91
RajuPedda

動的インポートを使用しているため、コードをesnextモジュールにターゲティングするには、このようにtsconfig.jsonを変更する必要があります

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext", // add this line
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

また、tsconfig.app.jsonに次のようなモジュールとターゲット構成がないことを確認してください

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": []
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "src/test.ts",
    "src/**/*.spec.ts"
  ]
}
151
Tony Ngo

@Tonyのanwserに追加するだけで、tsconfig.app.jsonでも同じことを行う必要があります（ "module"： "esnext"に変更）。私の場合、tsconfig.jsonはすでにesnextをモジュールとして使用していましたが、tsconfig.app.jsonはまだes2015を使用していたため、このエラーが発生しました。

18
Niz

これを行う適切な方法は、_tsconfig.app.json_ではなく_tsconfig.json_を調整することです。

tsconfig.app.json

_{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "baseUrl": "./",
    "module": "esnext",
    "types": []
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}
_

_tsconfig.app.json_は、Angular workspaceのルートの下にあるappに固有のTypeScript構成ファイルです。_tsconfig.app.json_が存在するので、Angularワークスペースにmultipleアプリが含まれているワークスペースを構築している場合、書き込む必要なく、アプリごとにTypeScript構成を個別に調整できます。アプリ間で重複する冗長構成プロパティ（つまり、extendsプロパティ）。

技術的には、_tsconfig.app.json_はまったく必要ありません。削除する場合は、_"module": "esnext"_を_tsconfig.json_に配置する必要があります。そのままにしておくと、_tsconfig.json_よりも優先されるため、_"module":"esnext"_に_tsconfig.app.json_行を追加するだけで済みます。

5
Zach Gollwitzer

@Tonyの答えに私の経験を追加したいだけです。変更後tsconfig.jsonまだエラーが表示されていました（赤い下線）。 エディターを再度開いた後のみ（VSCodeを使用しました）、赤い下線が消えました。

5
Tai JinYuan