Как правильно настроить мой systemjs.config для использования с ng2-codemirror?

Question

Я пытаюсь импортировать the codemirror ng2 module для использования в угловом приложении 2, которое я пишу, и сталкивается с некоторыми проблемами настройки. Выполняя это, я пытаюсь следовать вместе с импортом ng2-datetime-picker, который работает DID. Вот мой system.js.config

(function (global) { 
    System.config({ 
    path: { 
     'npm:' : 'node_modules/' 
    }, 
    map: { 
     app: 'app', 
     // ..... 
     // a bunch of angular libraries 
     // ...... 
     'ng2-datetime-picker': 'npm:ng2-datetime-picker/dist', // this works 
     'ng2-codemirror: 'npm:ng2-codemirror/lib'  // this does not work 
    }, 
    packages: { 
     app: { 
      main: './main.js', 
      default: 'js' 
     }, 
     'ng2-datetime-picker': { 
      main: 'ng2-datetime-picker.umd.js',   // this works 
      defaultExtension: 'js' 
     }, 
     'ng2-codemirror': {        // this does not work 
      main: 'Codemirror.js', 
      defaultExtension: 'js' 
     } 
    } 
    }); 
})(this); 

Это называется внутри index.html

<script src="/node_modules/systemjs/dist/system.src.js"></script> 
<script src="/systemjs.config.js"></script> 
<script> 
    System.import('app').catch(function(err) { 
     console.log(err); 
    }); 
</script> 

Вот мой node_modules/папка с соответствующими папками/файлами

index.html 
system.js.config 
node_modules/ 
    ng2-datetime-picker/ 
     dist/ 
      ng2-datetime-picker.umd.js 
    ng2-codemirror/ 
     lib/ 
      Codemirror.js 

Теперь, Я действительно надеюсь, что это достаточно фона моей проблемы. Когда я загружаю страницу, я получаю следующее сообщение об ошибке внутри веб-консоли.

GET XHR http://localhost:8050/codemirror [HTTP/1.1 404 Not Found 4ms] 
Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:8050/codemirror 
patchProperty/desc.set/wrapFn@http://localhost:8050/node_modules/zone.js/dist/zone.js:698:26 
ZoneDelegate.prototype.invokeTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:265:21 
Zone.prototype.runTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:154:28 
ZoneTask/this.invoke@http://localhost:8050/node_modules/zone.js/dist/zone.js:335:28 

Error loading http://localhost:8050/codemirror as "codemirror" from http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js 
Stack trace: 
(SystemJS) XHR error (404 Not Found) loading http://localhost:8050/codemirror 
patchProperty/desc.set/wrapFn@http://localhost:8050/node_modules/zone.js/dist/zone.js:698:26 
ZoneDelegate.prototype.invokeTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:265:21 
Zone.prototype.runTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:154:28 
ZoneTask/this.invoke@http://localhost:8050/node_modules/zone.js/dist/zone.js:335:28 

Error loading http://localhost:8050/codemirror as "codemirror" from http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js 

Я не знаю, что с этим StackTrace, но похоже, запрос пытается быть сделаны

localhost:8050/codemirror 

и он терпит неудачу. Кажется, он пытается загрузить «codemirror» .... У меня не было этой проблемы с datetimepicker. Кто-нибудь имеет представление о том, как помочь мне с этим? Работает datetimepicker, я пытаюсь сделать то же самое с модулем codemirror.

Edit, я последовал за некоторые инструкции, и теперь мой system.config.js выглядит следующим образом (с материалом у меня уже был, конечно)

map : { 
    // previous stuff 
    'codemirror' : 'npm:codemirror' 
}, 
packages : { 

    // previous stuff 

    'codemirror' : { 
     main: 'lib/codemirror.js', 
     defaultExtension: 'js' 
    }, 
    'ng2-codemirror' : { 
     format: 'global', 
     main: 'Codemirror.js', 
     defaultExtension: 'js' 
    } 
} 

И Я скачал «CodeMirror msgstr "создать проект в папку моих модулей узлов.

node_modules/ 
    codemirror/ 
     lib/ 
      codemirror.js 

Теперь, когда я запускаю приложение, я получаю следующую трассировку стека.

Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js 
patchProperty/desc.set/wrapFn@http://localhost:8050/node_modules/zone.js/dist/zone.js:698:26 
ZoneDelegate.prototype.invokeTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:265:21 
Zone.prototype.runTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:154:28 
ZoneTask/this.invoke@http://localhost:8050/node_modules/zone.js/dist/zone.js:335:28 

Error loading http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js as "ng2-codemirror" from http://localhost:8050/app/app.module.js 
Stack trace: 
(SystemJS) XHR error (404 Not Found) loading http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js 
patchProperty/desc.set/wrapFn@http://localhost:8050/node_modules/zone.js/dist/zone.js:698:26 
ZoneDelegate.prototype.invokeTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:265:21 
Zone.prototype.runTask@http://localhost:8050/node_modules/zone.js/dist/zone.js:154:28 
ZoneTask/this.invoke@http://localhost:8050/node_modules/zone.js/dist/zone.js:335:28 

Error loading http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js as "ng2-codemirror" from http://localhost:8050/app/app.module.js 

Это суть его, кажется,

Error loading http://localhost:8050/node_modules/ng2-codemirror/lib/Codemirror.js as "ng2-codemirror" 

Ввоз линия в моих app.module.ts выглядит следующим образом

import { CodemirrorModule } from 'ng2-codemirror'; 

Любой знает, как я могу правильно подобрать этот модуль с этой точки?

Answer 1

NG2-CodeMirror имеет codemirror в качестве своей зависимости, и есть

var _codemirror = require('codemirror'); 

line в ng2-codemirror/lib/Codemirror.js.

Поскольку в вашей системе systemjs нет конфигурации для codemirror, этот require() переведен в http://localhost:8050/codemirror URL-адрес и не удается.

Попробуйте добавить это map и packages в system.js.config:

map: { 
    // ..... 
    'codemirror': 'npm:codemirror', 
}, 
packages: { 
    // .. 
    codemirror: { 
     main: 'lib/codemirror.js' 
    }, 

Answer 2

Проверьте это, помог мне. https://github.com/systemjs/systemjs/issues/969 (некоторые проблемы с строк комментария)

Короче говоря, редактировать ваши systemjs конфигурационный файл следующим образом:

'ng2-codemirror': {        
     format: 'global', 
     main: 'Codemirror.js', 
     defaultExtension: 'js' 
    }