無法加載我自己的組件-angular2

Question

我無法以加載位於從「應用程序/聯想/ abc.component.ts」

「應用程序/共享/查詢/ lookup.component.ts」組件我的文件夾結構

錯誤

tsconfig

{ 
    "compilerOptions": { 
    "outDir": "dist", 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": true, 
    "suppressImplicitAnyIndexErrors": true 
    }, 
    "exclude": [ 
    "bower_components", 
    "node_modules", 
    "typings/main", 
    "typings/main.d.ts" 
    ] 
} 

這裏是我的系統配置

/** 
     * System configuration for Angular 2 samples 
     * Adjust as necessary for your application needs. 
     */ 
     (function (global) { 

     // map tells the System loader where to look for things 
     var map = { 
      'app': 'dist', 

      '@angular': 'node_modules/@angular', 
      'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
      'rxjs': 'node_modules/rxjs', 
      '@vaadin': 'node_modules/@vaadin', 
      'moment': 'node_modules/moment' 
     }; 

     // packages tells the System loader how to load when no filename and/or no extension 
     var packages = { 
      app: { 
      main: 'main.js', 
      defaultExtension: 'js' 
      }, 
      'rxjs': { defaultExtension: 'js' }, 
      'angular2-in-memory-web-api': { defaultExtension: 'js' }, 
      '@vaadin/angular2-polymer': { main: 'index.js', defaultExtension: 'js' }, 
      'moment': { main: 'moment', defaultExtension: 'js' }, 
     }; 

     var ngPackageNames = [ 
      'common', 
      'compiler', 
      'core', 
      'http', 
      'platform-browser', 
      'platform-browser-dynamic', 
      'router', 
      'router-deprecated', 
      'upgrade', 
     ]; 

     // Individual files (~300 requests): 
     function packIndex(pkgName) { 
      packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
     } 
     // Bundled (~40 requests): 
     function packUmd(pkgName) { 
      packages['@angular/' + pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' }; 
     } 

     // No umd for router yet 
     packages['@angular/router'] = { main: 'index.js', defaultExtension: 'js' }; 

     // Forms not on rc yet 
     packages['@angular/forms'] = { main: 'index.js', defaultExtension: 'js' }; 


     // Most environments should use UMD; some (Karma) need the individual index files 
     var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 
     // Add package entries for angular packages 
     ngPackageNames.forEach(setPackageConfig); 

     var config = { 
      paths: { 
      'app/*': './dist/*' 
      }, 
      map: map, 
      packages: packages 
     }; 

     System.config(config); 

     })(this); 

的package.json

{ 
    "name": "sg-associate-portal", 
    "version": "2.0.0", 
    "description": "This is an application for SenecaGlobal", 
    "repository": "", 
    "scripts": { 
    "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ", 
    "lite": "lite-server", 
    "postinstall": "typings install", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w", 
    "typings": "typings" 
    }, 
    "license": "Apache-2.0", 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.4", 
    "@angular/compiler": "2.0.0-rc.4", 
    "@angular/core": "2.0.0-rc.4", 
    "@angular/forms": "0.2.0", 
    "@angular/http": "2.0.0-rc.4", 
    "@angular/platform-browser": "2.0.0-rc.4", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.4", 
    "@angular/router": "3.0.0-beta.1", 
    "@angular/router-deprecated": "*", 
    "@angular/upgrade": "2.0.0-rc.4", 
    "@vaadin/angular2-polymer": "1.0.0-beta2", 
    "angular2-in-memory-web-api": "0.0.14", 
    "bootstrap": "^3.3.6", 
    "core-js": "^2.4.0", 
    "moment": "^2.14.1", 
    "pace": "0.0.4", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "sweetalert2": "*", 
    "systemjs": "0.19.27", 
    "zone.js": "^0.6.12" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings": "^1.0.4" 
    } 
} 

幫幫我！

我觀察到應用程序無法加載文件夾外的組件。 即 如果組件'A'位於根 的文件夾'1'中，則組件'B'位於根的文件夾'2'中;應用程序無法從組件A加載組件B. 它總是嘗試僅針對當前文件夾搜索組件。

Answer 1

您附加的錯誤消息表明它正在尋找dist/的同事 /shared/lookup/lookup.component.ts中的查找組件。

我覺得你的進口在「應用程序/聯想/ abc.component.ts」查找組件是不正確......

Answer 2

上的問題 - 你可能在遍歷錯過了。即「../」

其次，這些錯誤應該在編譯時顯示。如果沒有一個強有力的理由來使用精簡版的服務器，使用的WebPack發展 - 將會顯著降低你的時間與其他利益

https://angular.io/docs/ts/latest/guide/webpack.html