Името на външния модул на Webpack с тирета - javascript, ъглово-рутер, уеб пакет

Опитвам се да заредя angular-ui-router в Webpack като външна зависимост. Името на модула е „angular-ui-router“. Ето пример:

module.exports = webpackMerge(commonConfig, {
...
externals: {
"angular": true,
"angular-ui-router": true
},
...
});

Проблемът с това е, че Webpack създава модул в моя app.bundle.js, който изглежда като следното:

/***/ },
/* 1 */
/***/ function(module, exports) {

module.exports = angular;

/***/ },
/* 2 */
/***/ function(module, exports) {

module.exports = angular-ui-router;

/***/ }
/******/ ]);

Когато браузърът се опита да зареди модула, той оценява module.exports = angular-ui-router като израз, хвърляйки следната грешка:

Uncaught ReferenceError: ui is not defined

Единственото поправяне, което намерих за този проблем, е:

module.exports = webpackMerge(commonConfig, {
...
externals: {
"angular": true,
"angular-ui-router": "window["angular-ui-router"]"
},
...
});

Това дава правилния резултат.

Има ли по-добър начин?

Отговори:

Когато имате име на външни модули с тире, използвайте libraryTarget като umd в изходната част. Така че кодът на app.bundle ще има

require("angular-ui-router") would be used for requireJS and
root.angularUIRouter = factory(root["angular-ui-router"]) would be used for global variable type.

Кодът на групата ще изглежда така:

"object" == typeof exports && "object" == typeof module ?
module.exports = factory(require("angular-ui-router")) : "function" ==
typeof define && define.amd ? define(["angular-ui-router"], factory) :
"object" == typeof exports ? exports.temp = factory(require("angular-ui-
router")) : root.temp = factory(root["angular-ui-router"])