Angular2 require ist nicht für Bibliotheken in node_modules definiert

Question

Ich verwende angular2-seed als Startwert für mein Projekt. Die require funktioniert einwandfrei in Quelldateien. Aber wenn ich eine neue Bibliothek einfüge und sie in index.html verweise, erscheint ein Fehler in der Konsole, der require nicht definiert ist.

Systemjs ist enthalten

Ich habe LESEN früheren Antworten auf SO, die system.js verwenden lässt. Das Systemjs ist bereits enthalten.

Index.HTML

<!-- shims:js --> 
 
<script src="/node_modules/systemjs/dist/system.src.js?1458283463580"></script> 
 
<script src="/node_modules/systemjs/dist/system-polyfills.src.js?1458283463581"></script> 
 
<script src="/node_modules/reflect-metadata/Reflect.js?1458283463582"></script> 
 
<script src="/node_modules/es6-shim/es6-shim.js?1458283463582"></script> 
 
    <script src="/node_modules/angular2/bundles/angular2-polyfills.js?1458283463582"></script> 
 
<!-- endinject --> 
 

 
    
 
<script>System.config({"defaultJSExtensions":true,"paths":{"./admin/main":"/./admin/main","angular2/*":"/angular2/*","rxjs/*":"/rxjs/*","*":"/node_modules/*"},"packages":{"angular2":{"defaultExtension":false},"rxjs":{"defaultExtension":false}},"map":{"moment":"moment/moment.js"}})</script> 
 
    
 

 
<!-- libs:js --> 
 
<script src="/node_modules/rxjs/bundles/Rx.js?1458283463585"></script> 
 
<script src="/node_modules/angular2/bundles/angular2.js?1458283463585"></script> 
 
<script src="/node_modules/angular2/bundles/router.js?1458283463585"></script> 
 
<script src="/node_modules/angular2/bundles/http.js?1458283463586"></script> 
 
<script src="/node_modules/ng2-bootstrap/ng2-bootstrap.js?1458283463586"></script> 
 
<script src="/node_modules/ng2-select/ng2-select.js?1458283463586"></script> 
 
<script src="/node_modules/lodash/index.js?1458283463587"></script> 
 
<script src="/node_modules/ng2-pagination/index.js?1458283463587"></script> 
 
<!-- endinject --> 
 

 
<!-- inject:js --> 
 
<!-- endinject --> 
 

 
    
 
<script> 
 
System.import('./admin/main') 
 
    .catch(function (e) { 
 
    console.error(e, 
 
     'Report this error at https://github.com/punchagency/staffing-client/issues'); 
 
    }); 
 
</script>

Fehler

Quelle, wo erforderlich verwendet wird

index.js von lodash

module.exports = require('./lodash'); 

Ähnlich anderen Bibliotheken wie ng2-select und ng2-bootstrap haben ähnliche Fehler

Answer 1

Sie benötigen eine zusätzliche Abhängigkeiten in SystemJS konfigurieren und sie nicht direkt in script Tag enthalten.

Hier ist ein Beispiel ist:

<script> 
    System.configure({ 
    map: { 
     'ng2-bootstrap': 'node_modules/ng2-bootstrap', 
     'ng2-select': 'node_modules/ng2-select', 
     lodash: 'node_modules/lodash/lodash.js' 
    }, 
    package: { 
     (...) 
    } 
    }); 
    System.import(...); 
</script> 

diese Fragen für mehr Details:

• integrate bootstrap module and ng2-select module to angular2 5min quickstart
• angular2 failing lodash import