it-swarm.com.de

Das komprimierte Webpack gzip-Paket wird nicht bereitgestellt, das nicht komprimierte Paket

Ich probiere Webpack zum ersten Mal aus. Ich benutze Gulp schon seit einiger Zeit mit Browserify und bin damit ziemlich vertraut. An dieser Stelle teste ich nur ein paar Webpack-Plugins. Nämlich das Komprimierungs-Webpack-Plugin. Ich habe noch nie Kompression verwendet. Also, wenn ich einen Noob-Fehler mache, dann bitte ich Sie um Verständnis.

Unten finden Sie meine webpack.config.js. Das Ergebnis ist, ich bekomme eine main.js, main.js.gz, main.css und index.html. Die main.js wird in die index.html eingefügt, aber wenn ich die index.html in meinem Browser öffne, wird die unkomprimierte main.js verwendet, nicht die komprimierte main.js.gz. Ich hatte gelesen, dass ich die .gz-Erweiterung nicht in mein Skript-Tag einfügen muss. Das HTML-Webpack-Plugin enthält sie nicht. Ich habe also gedacht, dass die Dinge richtig funktionieren, aber das unkomprimierte main.js wird bedient. anstatt der komprimierten.

var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var CompressionPlugin = require('compression-webpack-plugin');

module.exports = {
  entry: './app/scripts/main.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: '[name].js',
    chunkFilename: '[id].js'
  },
  module: {
    loaders: [
      {test: /\.scss$/, exclude: /node_modules/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader')},
      {test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'}
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      hash: true,
      template: 'app/index.html',
      inject: 'body'
    }),
    new ExtractTextPlugin('[name].css'),
    new CompressionPlugin()
  ]
};
9
Patrick Grimard

Um main.js.gz anstelle von main.js zu laden, falls main.js im script- Tag enthalten ist, müssen Sie Ihren Webserver konfigurieren (Apache, nginx usw.).

Denken Sie daran, dass die Konfiguration .js.gz oder .js laden sollte, abhängig davon, ob der Browser gzip akzeptiert. Der Webserver kann den HTTP-Anforderungsheader Accept-Encoding: gzip, deflate überprüfen.

In Browser devtools sehen Sie in jedem Fall main.js. 

11

Sie können gz-Statik problemlos mit dem nginx gzip static-Modul bereitstellen. Der Server prüft, ob die app.js.gz-Datei für z. Der angeforderte /statics/app.js ist vorhanden und dient ihm transparent. Es ist nicht erforderlich, Ihre Anwendung zu ändern oder Accept-Encoding zu erkennen - alles, was vom nginx-Modul gehandhabt wird. Hier ist ein Konfigurationsausschnitt:

location /statics/ {
  gzip_static on;
}
5
gertas

Ich bin etwas spät dran, aber ich dachte, ich würde mein 2c hinzufügen. Ich habe eine GZ-Datei mit Webpack erstellt, aber Apache bediente die unkomprimierte (oder, falls sie nicht vorhanden war), obwohl Accept-Encoding korrekt eingestellt war. Es stellte sich heraus, dass ich AddEncoding x-gzip .gz .tgz auskommentieren und httpd neu laden musste. Für das Protokoll war AddType application/x-gzip .gz .tgz bereits festgelegt, und ich verwende Apache 2.4.6 mit Chrome 62. Vielen Dank an Dmitry oben, dass Sie mich angestoßen haben, um meine conf/httpd.conf-Datei anzusehen.

0
Nate