javascript - 未提供 Webpack gzip 压缩包,未压缩包是

标签 javascript html compression gzip webpack

我是第一次尝试 Webpack。我已经将 Gulp 与 Browserify 一起使用了一段时间,并且对它非常满意。在这一点上,我只是在测试几个 Webpack 插件。即 compression-webpack-plugin。我以前从未使用过压缩,所以如果我犯了任何菜鸟错误,请多多包涵。

下面是我的 webpack.config.js。结果是我得到了 main.js、main.js.gz、main.css 和 index.html。 main.js 被注入(inject)到 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()
  ]
};

最佳答案

加载main.js.gz而不是 main.js如果包含 main.jsscript -tag,您需要配置您的网络服务器(apache、nginx 等)

记住配置应该加载.js.gz.js取决于浏览器是否接受 gzip。 Web 服务器可以在 HTTP 请求 header 中检查它 Accept-Encoding: gzip, deflate

在任何情况下,在浏览器开发工具中你都会看到 main.js。

关于javascript - 未提供 Webpack gzip 压缩包,未压缩包是,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34827956/

相关文章:

encoding - 哪种二维条码具有最高的数据容量/密度

compression - 有什么方法可以预测 png 大小吗?

javascript - 如何清除或替换缓存的图像

javascript - 调用按钮单击并显示 ExtNet 确认消息

javascript - 用于移动设备的 Bootstrap pgwslideshow

html - 元素支持 CSS 属性

html - Wordpress - 在页脚元素之前添加伪类

oracle - 使用 UTL_FILE 从 Oracle 表中提取 BLOB 文件,有些压缩了有些没有

javascript - Angular : What is a factory?

javascript - 对数字数组进行排序,使空值排在最后