it-swarm.com.ru

Сжатый пакет Webpack gzip не обслуживается, несжатый пакет

Я пробую Webpack в первый раз. Я использую Gulp с Browserify в течение некоторого времени, и мне это довольно удобно. На данный момент я просто тестирую пару плагинов Webpack. А именно сжатие-веб-пакет-плагин. Я никогда раньше не использовал сжатие, так что терпите меня, если я сделаю какую-нибудь ошибку.

Ниже мой webpack.config.js. В результате я получаю main.js, main.js.gz, main.css и index.html. Файл main.js внедряется в index.html, но если я открою index.html в своем браузере, он обслуживает несжатый main.js, а не сжатый main.js.gz. Я читал, что мне не нужно включать расширение .gz в тег скрипта, а плагин html-webpack-plugin не включает его, поэтому я решил, что все работает правильно, но несжатый main.js обслуживается, а не сжатый.

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

Чтобы загрузить main.js.gz вместо main.js в случае включения main.js в тег script-, вам необходимо настроить свой веб-сервер (Apache, nginx и т.д.)

Помните, что конфигурация должна загружать .js.gz или .js в зависимости от того, принимает ли браузер gzip. Веб-сервер может проверить это в заголовке HTTP-запроса Accept-Encoding: gzip, deflate

В браузере devtools вы увидите main.js в любых случаях. 

11
Dmitry Yaremenko

Вы можете условно обслуживать статические данные gz с помощью nginx gzip static module . Сервер проверяет, есть ли файл app.js.gz, например, для запрошенный /statics/app.js присутствует и обслуживает его прозрачно. Нет необходимости менять приложение или определять Accept-Encoding - все это обрабатывается модулем nginx. Вот фрагмент конфигурации:

location /statics/ {
  gzip_static on;
}
5
gertas

Я немного опоздал к этой теме, но думал, что добавлю свой 2c. Я сгенерировал файл gz с помощью веб-пакета, но Apache продолжал обслуживать несжатый файл (или с ошибками, если его не было), несмотря на то, что Accept-Encoding был установлен правильно. Оказывается, мне пришлось раскомментировать AddEncoding x-gzip .gz .tgz и перезагрузить httpd. Для записи, AddType application/x-gzip .gz .tgz уже был установлен, и я использую Apache 2.4.6 с Chrome 62. Спасибо Дмитрию выше за то, что подтолкнули меня посмотреть на мой файл conf/httpd.conf.

0
Nate