Wie bündelt man eine Bibliothek mit Webpack?

Ich möchte eine Frontend-Bibliothek erstellen. Daher möchte ich Webpack verwenden. Besonders gefällt mir der CSS- und Image-Loader. Allerdings kann ich nur Nicht-JS-Dateien erfordern, wenn ich Webpack verwende. Da ich eine Bibliothek erstelle, kann ich nicht garantieren, dass dies auch der Benutzer meiner Bibliothek tut.Wie bündelt man eine Bibliothek mit Webpack?

Gibt es eine Möglichkeit, alles in ein UMD-Modul zu bündeln, um es zu veröffentlichen? Ich habe versucht, mehrere Einstiegspunkte zu verwenden, aber ich kann das Modul dann nicht verlangen.

Vielen Dank im Voraus

Quelle

2016-12-28 Arwed Mett

Vielleicht vermisse ich etwas, meinst du, dass Sie Ihr Bibliothekspaket zu npm veröffentlichen möchten, und Benutzer 'importieren' es? Warum also "Ich kann nur Nicht-JS-Dateien benötigen, wenn ich Webpack benutze"? Kannst du ein Beispiel geben? Und zu "Ich habe versucht, mehrere Einstiegspunkte zu nutzen" Haben Sie die Möglichkeit in Betracht gezogen, dass Sie kein "Webpack" brauchen - nur "Babel" reicht aus? –

Ja, ich habe nur die Verwendung von Babel in Betracht gezogen. Wenn ich jedoch ("./ something.css") benötige und webpack nicht in einem Projekt verwende, wo ich es benötige ("my-library"). Wenn ich das ausführe, wird es nicht funktionieren. –

Sie möchten also eine Bibliothek erstellen, die ohne Webpack verwendet würde? OK. Hast du es mit einem einzigen Einstieg versucht? –

können Sie gute Anleitung finden für Bibliotheken in Webpack 2.0 documentation site zu schaffen. Deshalb verwende ich in diesem Beispiel die Ver 2-Syntax in webpack.config.js.

Hier ist eine Github repo mit einer Beispielbibliothek.

Es baut alle Dateien aus src/ (js, png und css) in einem JS Bündel, das einfach als umd Modul benötigt werden.

für die wir angeben müssen die folgen Einstellungen in webpack.config.js: sollte

output: { 
    path: './dist', 
    filename: 'libpack.js', 
    library: 'libpack', 
    libraryTarget:'umd' 
},

und package.json haben:

"main": "dist/libpack.js",

Beachten Sie, dass Sie über die entsprechenden Lader verwenden müssen, um alles in eine Datei zu packen . z.B. base64-image-loader

Quelle

2017-01-05 12:07:37

Ist es also so, dass die Bibliotheksbilder nur verwendet werden können, wenn sie inline sind? – davesaus

@davesaus können Sie Bilder in getrennten Dateien speichern. Es hängt davon ab, wie Sie es dann verwenden werden –

Was brauche ich, wenn ich App auch mit lib zusammen bauen möchte? –

Wie bündelt man eine Bibliothek mit Webpack?

Antwort

Verwandte Themen