Ошибка: требование не является функцией при загрузке внешнего модуля в Angular 2

Question

ng2-dragula кажется классным, но мне сложно настроить его для моего проекта с угловым 2. Я использую system.js в качестве модуля прелоадер и его конфигурация:

System.config({ 
    packages: {   
     app: { 
     format: 'register', 
     defaultExtension: 'js' 
     }, 
     'ng2-bootstrap': {}, 
     'ng2-dragula': { defaultExtension: 'js' } 
    }, 
    map: { 
     'dragula': 'node_modules/dragula', 
     'ng2-bootstrap': 'node_modules/ng2-bootstrap', 
     'ng2-dragula': 'node_modules/ng2-dragula', 
     'moment': 'node_modules/moment/moment.js' 
    } 
}); 

Мои tsconfig.json:

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "system", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false, 
    "watch": true 
    } 
} 

И я загрузить его в моем компоненте следующим образом:

import {DragulaService, Dragula} from 'ng2-dragula/ng2-dragula' 

@Component({ 
    selector: 'my-cmp', 
    viewProviders: [DragulaService], 
}) 


@View({ 
    template: '<div>Hey</div>', 
    directives: [Dragula] 
}) 

Что я делаю неправильно, так что я получил следующую ошибку в браузере:

Error: require is not a function(…) angular2-polyfills.js:1243 

Answer 1

Возможно, вы загрузите некоторые скрипты, которые скомпилированы как модули commonjs через теги <script src="some-module.js">. Вместо этого вы должны удалить их вместо System.import("some-module.js"). См. this answer для пояснения по аналогичной проблеме.