当依赖项在node_modules文件夹之外时，在angular中出现tsc编译错误

Question

我正在尝试将我的angular 1代码迁移到angular 2。现在我以混合的方式引导我的应用程序。我在node_modules文件夹中有我的angular 2配置文件。我想把这些文件移到public/assets/plugins folder.when里面，我把反射元数据和zone.js文件移到node_modules文件夹之外，然后用tsc命令编译代码，它给出了下面的错误。

public/assets/plugins/reflect-metadata/test/reflect-definemetadata.ts(5,24):error TS2307: Cannot find module 'chai'.
public/assets/plugins/reflect-metadata/test/reflect-definemetadata.ts(7,1): error TS2304: Cannot find name 'describe'.
public/assets/plugins/reflect-metadata/test/reflect-definemetadata.ts(8,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-definemetadata.ts(12,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-definemetadata.ts(16,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(5,24): error TS2307: Cannot find module 'chai'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(7,1): error TS2304: Cannot find name 'describe'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(8,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(12,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(18,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(25,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-deletemetadata.ts(33,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(5,24): error TS2307: Cannot find module 'chai'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(7,1): error TS2304: Cannot find name 'describe'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(8,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(12,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(18,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(25,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(33,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(39,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/reflect-metadata/test/reflect-getmetadata.ts(46,5): error TS2304: Cannot find name 'it'.
public/assets/plugins/zone.js/dist/zone.js.d.ts(129,11): error TS2451: Cannot redeclare block-scoped variable 'Zone'.
public/assets/plugins/zone.js/dist/zone.js.d.ts(374,14): error TS2300: Duplicate identifier 'HasTaskState'.
public/assets/plugins/zone.js/dist/zone.js.d.ts(383,14): error TS2300: Duplicate identifier 'TaskType'.
public/assets/plugins/zone.js/dist/zone.js.d.ts(482,15): error TS2451: Cannot redeclare block-scoped variable 'Zone'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(22,14): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(23,7): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(25,3): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(50,22): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(112,24): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/jasmine/jasmine.ts(113,4): error TS2304: Cannot find name 'jasmine'.
public/assets/plugins/zone.js/lib/zone.ts(130,11): error TS2451: Cannot redeclare block-scoped variable 'Zone'.
public/assets/plugins/zone.js/lib/zone.ts(409,6): error TS2300: Duplicate identifier 'HasTaskState'.
public/assets/plugins/zone.js/lib/zone.ts(416,6): error TS2300: Duplicate identifier 'TaskType'.
public/assets/plugins/zone.js/lib/zone.ts(542,7): error TS2451: Cannot redeclare block-scoped variable 'Zone' 

尽管我收到了上面的错误，但我的其他.ts文件正在正确编译，我的应用程序也运行得很好。是编译器尝试编译与依赖文件相关的.ts文件吗？如果是这样，如何避免该错误或其他错误？谁能帮帮我..

tsconfig.json文件

 {
"compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "noImplicitAny": false,
    "sourceMap": true,
    "experimentalDecorators": true
} }

systemjs.config.js文件

   (function (global) {
    System.config({
       transpiler:'typescript',

        typescriptOptions: {
           emitDecoratorMetadata: true },

paths: {
  // paths serve as alias
  'npm:': '/'
},
// map tells the System loader where to look for things
map: {
  // our app is within the app folder
  app: 'app_2',

  // angular bundles
  '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
  '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
  '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
  '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
  '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
   '@angular/upgrade/static': 'npm:@angular/upgrade/bundles/upgrade-static.umd.js',

  // other libraries
  'rxjs':                      'rxjs',
  'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
  app: {

    defaultExtension: 'js'
  },
  rxjs: {
    defaultExtension: 'js'
  },
},
      'angular2-in-memory-web-api': {
       defaultExtension: 'js'
    },
 });
})(this);`

index.html

  <script src="assets/plugins/zone.js/dist/zone.js"></script>
  <script src="assets/plugins/reflect-metadata/Reflect.js"></script>
  <script src="assets/plugins/systemjs/dist/system.src.js"></script>
  <script src="assets/plugins/systemjs/systemjs.config.js"></script>
  <script>
     System.import('app_2/main').then(null, console.error.bind(console));
  </script>'

文件结构：

app -- node_modules
    -- public
        -- app_2
        -- assets
           -- plugins
              --reflect-metadata 
              --zone.js 

Answer 1

在这里我找到了解决方案。在我的tsconfig文件中，我排除了相应的文件夹，如下所示。

{
"compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "noImplicitAny": false,
    "sourceMap": true,
    "moduleResolution": "node",
    "experimentalDecorators": true

},
 "exclude": [
"public/assets/plugins/angular_2"
]

}

似乎typescript编译器尝试在zone.js中编译.ts文件并反映元数据。因此，通过排除该文件夹可以解决问题。:)但是当我把@angular文件夹移动到plugins文件夹时，它给出了错误“找不到模块”。我不能排除该文件夹，因为我需要它在.ts文件中。

有什么解决方案吗？

Answer 2

在您的tsconfig.json中，您缺少一个moduleResolution属性来告诉tsc如何解析模块：

moduleResolution: 'node'