2016-07-06 9 views
1

로다시에 문제가 있습니다. 나는 꿀꺽를 사용하여 배포 할 때 나는 항상 같은 오류했습니다 : 내 타이프 스크립트 파일로 lodash 가져로다시를 배포 할 수 없습니다.

<script src="node_modules/lodash/lodash.js"></script> 

index.html을 파일로

vendors.min.js:3 GET http://127.0.0.1/projects/myproject/lodash 404 (Not Found) 

내가 라이브러리를 선언을

///<reference path="../../../typings/modules/lodash/index.d.ts" /> 
import * as _ from "lodash"; 

내 웹 사이트 localy (npm start로 lite 서버를 시작 함)를 테스트 할 때 작동합니다.

이제 Gulp를 사용하여 웹 사이트를 배포하고 싶습니다. 여기 내 꿀꺽 파일입니다 :

gulp.task('app-bundle', function() { 
    var tsProject = ts.createProject('tsconfig.json', { 
     typescript: require('typescript'), 
     outFile: 'app.js' 
    }); 

    var tsResult = gulp.src([ 
    'node_modules/angular2/typings/browser.d.ts', 
    'typings/main/ambient/firebase/firebase.d.ts', 
    'app/**/*.ts' 
    ]) 
    .pipe(ts(tsProject)); 

    return tsResult.js.pipe(addsrc.append('config-prod.js')) 
        .pipe(concat('app.min.js')) 
        .pipe(uglify()) 
        .pipe(gulp.dest('./dist')); 
}); 

gulp.task('vendor-bundle', function() { 
    gulp.src([ 
      'node_modules/es6-shim/es6-shim.min.js', 
      'node_modules/systemjs/dist/system-polyfills.js', 
      'node_modules/angular2/bundles/angular2-polyfills.js', 
      'node_modules/systemjs/dist/system.src.js', 
      'node_modules/rxjs/bundles/Rx.js', 
      'node_modules/angular2/bundles/angular2.dev.js', 
      'node_modules/angular2/bundles/http.dev.js', 
      'node_modules/angular2/bundles/router.min.js', 
      'node_modules/lodash/lodash.js' 

     ]) 
     .pipe(concat('vendors.min.js')) 
     .pipe(uglify()) 
     .pipe(gulp.dest('./dist')); 
}); 

gulp.task('default',[ 'app-bundle', 'vendor-bundle' ], function() { 
    gulp.src('index.html') 
    .pipe(htmlreplace({ 
     'vendor': 'vendors.min.js', 
     'app': 'app.min.js' 
    })) 
    .pipe(gulp.dest('dist')); 
}); 

내 웹 사이트를 테스트 할 때, 나는 다음과 같은 오류가 : 나는 많은부터 검색

System.config({ 
    paths: { 
    'rxjs/add/observable/*' : 'node_modules/rxjs/add/observable/*.js', 
    'rxjs/add/operator/*' : 'node_modules/rxjs/add/operator/*.js', 
    'rxjs/*' : 'node_modules/rxjs/*.js' 
    }, 
    map: { 
    '@angular' : 'angular2', 
    'videogular2' : 'node_modules/videogular2', 
    'rxjs': 'node_modules/rxjs', 
    'lodash': 'node_modules/lodash' 
    }, 
    packages: { 
    map: { 
     'rxjs': 'node_modules/rxjs' 
    }, 
    app: { 
     format: 'register', 
     defaultExtension: 'js' 
    }, 
    node_modules: { 
     defaultExtension: 'js' 
    }, 
    lodash:{ 
     main:'lodash', 
     defaultExtension:'js' 
    } 
    } 
}); 
System.import('app/boot') 
     .then(null, console.error.bind(console)); 

: 여기

vendors.min.js:3 GET http://127.0.0.1/projects/myproject/lodash 404 (Not Found)r @ vendors.min.js:3e.scheduleTask @ vendors.min.js:3e.scheduleMacroTask @ vendors.min.js:3(anonymous function) @ vendors.min.js:3send @ VM3157:3L @ vendors.min.js:4(anonymous function) @ vendors.min.js:4e @ vendors.min.js:3(anonymous function) @ vendors.min.js:4(anonymous function) @ vendors.min.js:4(anonymous function) @ vendors.min.js:5(anonymous function) @ vendors.min.js:5(anonymous function) @ vendors.min.js:5(anonymous function) @ vendors.min.js:5(anonymous function) @ vendors.min.js:5(anonymous function) @ vendors.min.js:4e.invoke @ vendors.min.js:3e.run @ vendors.min.js:3(anonymous function) @ vendors.min.js:3e.invokeTask @ vendors.min.js:3e.runTask @ vendors.min.js:3o @ vendors.min.js:3invoke @ vendors.min.js:3 
vendors.min.js:3 Error: XHR error (404 Not Found) loading http://127.0.0.1/projects/myproject/lodash 
    Error loading http://127.0.0.1/projects/myproject/lodash as "lodash" from http://127.0.0.1/projects/myproject/services/base-services/base.services 
    at o (http://127.0.0.1/projects/myproject/vendors.min.js:4:10124) 
    at XMLHttpRequest.L.a.onreadystatechange (http://127.0.0.1/projects/myproject/vendors.min.js:4:10712) 
    at XMLHttpRequest.t [as _onreadystatechange] (http://127.0.0.1/projects/myproject/vendors.min.js:3:12638) 
    at e.invokeTask (http://127.0.0.1/projects/myproject/vendors.min.js:3:8519) 
    at e.runTask (http://127.0.0.1/projects/myproject/vendors.min.js:3:5879) 
    at XMLHttpRequest.invoke (http://127.0.0.1/projects/myproject/vendors.min.js:3:9628) 

내 SystemJS한다 일 솔루션 및 정말 감사합니다 :). 내가 배포 할 때

, 나는 너무 그 스크립트를 추가 :

document.addEventListener('DOMContentLoaded', function() { 
    System.import('boot') 
     .then(null, console.error.bind(console)); 
}); 
+0

SystemJS 구성은 어떻게 생겼습니까? – rinukkusu

+1

안녕하세요, SystemJS 구성으로 게시물을 업데이트했습니다. – Ivan

+0

누구? ... : '[ – Ivan

답변

1

드디어 성공!

System.config({ 
    meta:{ 
     'vendors.min.js':{ 
      format:'global' 
     } 
    }, 
    map:{ 
     'lodash':'http://127.0.0.1/js/lodash.min.js' 
    } 
}); 
  • gulp.task('lodash', function(){ 
        return gulp.src('node_modules/lodash/lodash.min.js') 
         .pipe(gulp.dest('./dist/js')); 
    }); 
    

    내가 그 뜻을 희망 lodash에 대한 꿀꺽 작업을 추가

      1. 은 아래의 시스템 구성을 만듭니다 다른 사람을 돕는다.

    +0

    공유해 주셔서 감사합니다. 나는 이걸로 고생하고있다. – Laurence

    관련 문제