Verwenden von Webpack zum Erstellen einer Bibliothek mit Skript-Tag importieren

Question

Ich habe ein Webpack-Projekt, wo ich ein paar Bibliotheken erstellen. Beide sollen mit <script> Tags importiert werden. Meine Config sieht wie folgt aus:

entry: { 
    bundle: ['./src/index', 'webpack-hot-middleware/client?reload=true'], 
    mylib: ['./src/loader', 'webpack-hot-middleware/client?reload=true'] 
}, 
target: web, 
output: { 
    path: `${__dirname}/dist`, 
    publicPath: 'http://localhost:3000/', 
    filename: '[name].js', 
    library: ['mylib', '[name]'], 
    libraryTarget: 'umd' 
}, 

Für meine Tests ist mein Einstieg sehr einfach:

module.exports = 'abracadabra'; 

Nach der Führung I how to build a complex library with webpack folgen, und wenn ich richtig verstanden, sollte dies ausreichend sein, dieses Verhalten im Browser zu erhalten (nach dem Index hTML-Datei mit dem Script-Tag zu öffnen):

console.log(mylib) -> 'abracadabra' 

Allerdings bedeutet dies nicht, und in der Konsole des Browsers kann ich s mylib ee definiert ist, aber es hat eine seltsame Form:

Object {mylib: Object} 
    mylib: Object 
    subscribe: function subscribe(handler) 
    useCustomOverlay: function useCustomOverlay(customOverlay) 
    __proto__: Object__proto__: 

Einige dieser Code hat mit dem HMR (Hot Module Replacement) zu tun, aber immer noch verstehe ich nicht, wie soll ich mein Modul verwenden.

Irgendwelche Ideen?

Answer 1

Haben Sie dies in Ihrem Einstiegspunkt?

if (module.hot) { 
    module.hot.accept(); 
}