2016-10-11 5 views
-1

내 angle 2 앱의 정적 묶음을 생성하려고합니다. 내 목표는 하나의 축소 된 js 파일을 systemj없이 스크립트 태그로 가져 오는 것입니다. systemjs 설정꿀풀로 systemjs-builder를 올바르게 구성 할 수 없습니다.

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": true, 
    "noImplicitAny": false, 
    "outDir": "__dist__" 
    }, 
    "filesGlob": [ 
    "**/*.ts", 
    "**/*.tsx", 
    "!node_modules/**" 
    ] 
} 

이 하나 :

(function() { 

    var DEFAULT_PACKAGE_CONFIG = { 
     main: './index.js', 
     defaultExtension: 'js' 
    }; 

    System.config({ 
     paths: { 
      'npm:': 'node_modules/' 
     }, 
     map: { 
      app: '__dist__', 
      monitoring: '__dist__/monitoring', 
      terminals: '__dist__/terminals', 
      statistics: '__dist__/statistics', 
      references: '__dist__/references', 

      '@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/http': 'npm:@angular/http/bundles/http.umd.js', 
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js', 
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js', 

      'rxjs': 'npm:rxjs', 
      'primeng': 'npm:primeng', 
      'wijmo': 'scripts/vendor', 
      'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api' 
     }, 
     packages: { 
      app: { 
       main: './main.js', 
       defaultExtension: 'js' 
      }, 
      rxjs: { 
       defaultExtension: 'js' 
      }, 
      primeng: { 
       defaultExtension: 'js' 
      }, 
      wijmo: { 
       defaultExtension: 'js' 
      }, 
      monitoring: DEFAULT_PACKAGE_CONFIG, 
      terminals: DEFAULT_PACKAGE_CONFIG, 
      statistics: DEFAULT_PACKAGE_CONFIG, 
      references: DEFAULT_PACKAGE_CONFIG, 
      'angular2-in-memory-web-api': { 
       main: './index.js', 
       defaultExtension: 'js' 
      } 
     } 
    }); 

})(); 

... 그리고 마지막으로 내 꿀꺽 꿀꺽 작업이 내 tsconfig입니다

MyProject/ 
    app/ 
     monitoring/ 
      a.ts 
      b.ts 
     terminals/ 
      a.ts 
      b.ts 
     main.ts 
     app.module.ts 
... 

: 내 응용 프로그램은 다음 (간체) 구조를 가지고 :

gulp.task('bundle:js', function() { 
    var builder = new SystemJsBuilder('.', './systemjs.config.js'); 
    return builder 
     .buildStatic('__dist__/app/main.js', buildFolder + '/bundle.js'); 
}); 

... 그러나 wh 나는 그것을 실행 도중, 내가 얻을 :

> Error on fetch for __dist__/app/monitoring.js at 
> file:///MyProject/__dist__/app/monitoring.js Loading 
> __dist__/app/app.module.js Loading __dist__/app/main.js ENOENT: no such file or directory, open '/MyProject/__dist__/app/monitoring.js' 

... "응용 프로그램"아래에 하위 폴더를 무시하는 것 같다 ... 왜? 이 오류를 수정하려면 어떻게해야합니까?

+0

해결책을 얻었습니까? –

답변

0

실제로 문제가 app 디렉토리를 무시하는 것이 아니라 구성에있는 것처럼 보입니다.

당신은이 :

System.config({ 
    packages: { 
     monitoring: { 
      main: './index.js', 
      defaultExtension: 'js' 
     } 
    ... 

그래서 난 당신의 코드 어딘가에 생각이 자동으로 인해 defaultExtensionmonitoring.js로 번역되어 monitoring을 가져오고이 파일이 존재하지 않기 때문에 따라서 오류가 발생합니다.

+0

"모니터링"패키지의 설정은 개발 중 systemjs에 필요합니다 (제대로 작동 함). 그렇지 않으면 꿀풀이 중 ... 직면 한대로 monitoring.js를로드하려고합니다 ... 소스 코드 가져 오기에서이 패키지는 다음과 같습니다 :'import (DashboardComponent, AvailabilityComponent, AlertsComponent) from "./monitoring"; ... 그래서 나는 진짜로 무엇이 잘못되었고 어떻게 해결해야하는지 이해하지 못한다. ( – daveoncode

+0

당신은 같은 SystemJS 설정을 사용할 필요가 없다. 브라우저에서 의존성을로드하는 것을 처리 할 수 ​​있고 컴파일 할 수 없다면 특정 리소스에'build : false' 옵션을 사용할 수 있습니다 .https : //github.com/ systemjs/builder # ignore-resources – martin

+0

사실, 문제는 여러 가지 가져 오기입니다 ... 내가 오류없이 컴파일하는 패키지의 각 구성 요소에 대해 단일 가져 오기를 정의한 경우 – daveoncode