Question

我正在尝试将我的角度1代码迁移到角度2.现在我以混合方式引导我的应用程序。我在node_modules文件夹中有我的角度2配置文件。我想将这些文件移到public / assets / plugins文件夹中。当我将reflect-metadata和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和reflect-metadata中的.ts文件。因此通过排除该文件夹可以解决问题。 :) 但是当我将@angular文件夹移动到plugins文件夹中时，它会出现错误＆＃34;找不到模块＆＃34;。我不能排除该文件夹，因为我需要在.ts文件中。

任何解决方案？

Answer 2

在你的tsconfig.json中，你错过了一个moduleResolution属性来告诉tsc如何解析模块：

moduleResolution: 'node'

当依赖项超出node_modules文件夹时，tsc编译角度错误

2 个答案: