Ich bin neu in der Node.js-Anwendung sowie Webpack. Während der Entwicklung würde ich webpack-dev-server ausführen, um meine Bundles zu erstellen, und es würde Stil-Tags erstellen und all das CSS dort aufsetzen. Wie bekomme ich die CSS in die Style-Tags auf einem Produktionsserver, da ich webpack-dev-server nicht ausführen kann?Style-Loader auf Webpack in Produktion
Die style-loader nicht auf webpack-dev-server abhängen, fügt einfach Ihre CSS auf das Bündel, so dass es ein <style> Tag in das <head> injizieren, daher der Name. Solange Sie immer noch die style-loader für Ihre Produktion verwenden, wird es genauso funktionieren.
Da abhängig von dem JavaScript-Paket geladen werden, bevor die CSS injiziert hat einige Nachteile, gibt es extract-text-webpack-plugin, die das CSS aus Ihrem Bundle extrahiert, geben Sie eine CSS-Datei, die Sie zu Ihrem HTML hinzufügen können CSS separat vom JavaScript-Bundle anfordern/bereitstellen.
Ich sehe. Ich habe das extract-text-webpack-plugin verwendet, um das CSS in sein eigenes Bundle zu extrahieren, aber ich habe versucht, mit webpack das CSS in die style-Tags zu bekommen. Wenn ich den webpack-dev-server ausführen würde, würde ich das CSS in den style-Tags sehen, aber wenn ich den webpack-dev-server nicht ausführe, dann sehe ich überhaupt nichts von dem CSS. Bedeutet das, dass ich node.js auf dem Produktionsserver installieren muss, damit es funktioniert? – Ron
Wenn Sie das 'extract-text-webpack-plugin' verwenden, müssen Sie das erstellte CSS in die von Ihnen bereitgestellte HTML-Datei einfügen (zusätzlich zum JavaScript-Paket). Sie verwenden wahrscheinlich nicht die gleichen Konfigurationen für Entwicklung und Produktion, daher der Unterschied. –
Ich werde das tun, scheint eine viel einfachere Route. Vielen Dank! – Ron