Webpack output UMD-библиотека с именем CamelCase и spinal-case

Question

Как настроить Webpack для создания пакета UMD, чтобы имя пакета для AMD и CommonJS было названо в нижнем регистре (spinal-case), а для глобального контекста будет иметь CamelCase имя?

Например, я ожидаю, что моя связка начать с

(function webpackUniversalModuleDefinition(root, factory) { 
    if(typeof exports === 'object' && typeof module === 'object') 
     module.exports = factory(require("dependency")); 
    else if(typeof define === 'function' && define.amd) 
     define("my-library", ["dependency"], factory);   // spinal-case 
    else if(typeof exports === 'object') 
     exports["my-library"] = factory(require("dependency")); // spinal-case 
    else 
     root["MyLibrary"] = factory(root["dependency"]);   // CamelCase 
})... 

Вот как это выглядит в ReactDOM:

(function(f) { 
    // CommonJS 
    if (typeof exports === "object" && typeof module !== "undefined") { 
    module.exports = f(require('react')); 

    // RequireJS 
    } else if (typeof define === "function" && define.amd) { 
    define(['react'], f); 

    // <script> 
    } else { 
    var g; 
    if (typeof window !== "undefined") { 
     g = window; 
    } else if (typeof global !== "undefined") { 
     g = global; 
    } else if (typeof self !== "undefined") { 
     g = self; 
    } else { 
     // works providing we're not in "use strict"; 
     // needed for Java 8 Nashorn 
     // see https://github.com/facebook/react/issues/3037 
     g = this; 
    } 
    g.ReactDOM = f(g.React); 
    } 
})(function(React)... 

Answer 1

Вы также должны иметь набор свойство umdNamedDefine в true. Это то, что мой блок output обычно выглядит, когда я делаю обернутую библиотеку UMD. Я буду использовать пример из пакета НМПА, что я в настоящее время, как это будет наиболее показательно:

output: { 
    path: './lib', 
    filename: 'dom-regex.js', 
    library: 'DomRegex', 
    libraryTarget: 'umd', 
    umdNamedDefine: true 
}, 

Учитывая, что мой пакет NPM назван в package.jsondom-regex, это позволяет мне использовать мои пакеты в следующем способы:

ES6:

import DomRegex from 'dom-regex'; 

RequireJS

var DomRegex = require('dom-regex'); 

В окне: (если файл подвергается непосредственно к окну)

window.DomRegex 

---

Что имя экспортируется как в UMD обернутый раздел не так важно, как что вы называете его при импорте. Использование dom-regex в качестве примера, даже если бы я имел его на месте в моем проекте (не в node_modules), и имя файла было dom-regex.js, я все еще мог сделать все предыдущие примеры, потому что это UMD обернуты:

Добро пожаловать для изучения repo for dom-regex и теста скачать пакет, чтобы увидеть, как это работает.