From a2b8f21cd669e92fa2248c1e4edeb213b48cae87 Mon Sep 17 00:00:00 2001 From: Ryan Weaver Date: Wed, 28 Nov 2018 09:45:20 -0500 Subject: [PATCH 1/4] Using contenthash instead of chunkhash --- lib/config-generator.js | 2 +- lib/plugins/versioning.js | 9 --------- package.json | 1 - yarn.lock | 29 ----------------------------- 4 files changed, 1 insertion(+), 40 deletions(-) diff --git a/lib/config-generator.js b/lib/config-generator.js index 00e6933d..f19ddc82 100644 --- a/lib/config-generator.js +++ b/lib/config-generator.js @@ -184,7 +184,7 @@ class ConfigGenerator { buildOutputConfig() { // Default filename can be overridden using Encore.configureFilenames({ js: '...' }) - let filename = this.webpackConfig.useVersioning ? '[name].[chunkhash:8].js' : '[name].js'; + let filename = this.webpackConfig.useVersioning ? '[name].[contenthash:8].js' : '[name].js'; if (this.webpackConfig.configuredFilenames.js) { filename = this.webpackConfig.configuredFilenames.js; } diff --git a/lib/plugins/versioning.js b/lib/plugins/versioning.js index c4eb254e..76e2bc1d 100644 --- a/lib/plugins/versioning.js +++ b/lib/plugins/versioning.js @@ -10,7 +10,6 @@ 'use strict'; const webpack = require('webpack'); -const WebpackChunkHash = require('webpack-chunk-hash'); const PluginPriorities = require('./plugin-priorities'); /** @@ -53,12 +52,4 @@ module.exports = function(plugins, webpackConfig) { // No plugin is added. But, see the "optimizations" config, // for inclusion of the "named modules". } - - if (webpackConfig.useVersioning) { - // enables the [chunkhash] ability - plugins.push({ - plugin: new WebpackChunkHash(), - priority: PluginPriorities.WebpackChunkHash - }); - } }; diff --git a/package.json b/package.json index f0393e3f..d8824834 100644 --- a/package.json +++ b/package.json @@ -49,7 +49,6 @@ "terser-webpack-plugin": "^1.1.0", "tmp": "^0.0.33", "webpack": "^4.20.0", - "webpack-chunk-hash": "^0.6.0", "webpack-cli": "^3.0.0", "webpack-dev-server": "^3.1.4", "webpack-manifest-plugin": "^2.0.2", diff --git a/yarn.lock b/yarn.lock index a775e4b8..54db0b8f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -738,28 +738,6 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-10.5.2.tgz#f19f05314d5421fe37e74153254201a7bf00a707" integrity sha512-m9zXmifkZsMHZBOyxZWilMwmTlpC8x5Ty360JKTiXvlXZfBWYpsg9ZZvP/Ye+iZUh+Q+MxDLjItVTWIsfwz+8Q== -"@types/tapable@*": - version "1.0.3" - resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.3.tgz#0db6e44f99933f9bfaa952ab9db9caa9ce4896e2" - integrity sha512-yz2OUW/HSKZnA2/hdxg5xoHxLbnzAbl1g5UW1eAJSYxVl2BmwKHt72w7Lfl4RU+BL/OWp/cGfSw+GPdN5kfqYg== - -"@types/uglify-js@*": - version "3.0.2" - resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.0.2.tgz#f30c75458d18e8ee885c792c04adcb78a13bc286" - integrity sha512-o8hU2+4xsyGC27Vujoklvxl88Ew5zmJuTBYMX1Uro2rYUt4HEFJKL6fuq8aGykvS+ssIsIzerWWP2DRxonownQ== - dependencies: - source-map "^0.6.1" - -"@types/webpack@^3.0.0 || ^4.0.0": - version "4.4.5" - resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.4.5.tgz#d45596fb67aeb724495ef5e7c78771bfc35f2955" - integrity sha512-CFRuLijysw6RK6ET+UozUMXO5DX57rXa7rYCr4h5pvI6YN6XQwIlyVNShGJpyRg3dWcoNfufTwH+HmjEcCkxRg== - dependencies: - "@types/node" "*" - "@types/tapable" "*" - "@types/uglify-js" "*" - source-map "^0.6.0" - "@vue/component-compiler-utils@^1.2.1": version "1.3.1" resolved "https://registry.yarnpkg.com/@vue/component-compiler-utils/-/component-compiler-utils-1.3.1.tgz#686f0b913d59590ae327b2a1cb4b6d9b931bbe0e" @@ -8744,13 +8722,6 @@ webidl-conversions@^2.0.0: resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-2.0.1.tgz#3bf8258f7d318c7443c36f2e169402a1a6703506" integrity sha1-O/glj30xjHRDw28uFpQCoaZwNQY= -webpack-chunk-hash@^0.6.0: - version "0.6.0" - resolved "https://registry.yarnpkg.com/webpack-chunk-hash/-/webpack-chunk-hash-0.6.0.tgz#eca36aff76e327d08a18a3e7990eb46e68376818" - integrity sha512-FsOg1RpW2nf3nYpGTy/Qs59RZ7gYG+sI4VrCE8TIBQYh/Kogi04xD39Pj9zUEeUcNx9HeTVPGSO3mtmpLeX9eQ== - dependencies: - "@types/webpack" "^3.0.0 || ^4.0.0" - webpack-cli@^3.0.0: version "3.0.8" resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-3.0.8.tgz#90eddcf04a4bfc31aa8c0edc4c76785bc4f1ccd9" From f2fd8ccb2d6e576cb55ea74557ba2b7f0c870263 Mon Sep 17 00:00:00 2001 From: Ryan Weaver Date: Wed, 28 Nov 2018 11:10:16 -0500 Subject: [PATCH 2/4] removing more contenthash --- index.js | 5 ++--- lib/plugins/versioning.js | 22 +++++++++++++--------- package.json | 1 + test/WebpackConfig.js | 4 ++-- test/config-generator.js | 2 +- test/functional.js | 2 +- yarn.lock | 29 +++++++++++++++++++++++++++++ 7 files changed, 49 insertions(+), 16 deletions(-) diff --git a/index.js b/index.js index db520b9d..7db82808 100644 --- a/index.js +++ b/index.js @@ -993,7 +993,7 @@ class Encore { * file is generated. * * Encore.configureFilenames({ - * js: '[name].[chunkhash].js', + * js: '[name].[contenthash].js', * css: '[name].[contenthash].css', * images: 'images/[name].[hash:8].[ext]', * fonts: 'fonts/[name].[hash:8].[ext]' @@ -1003,8 +1003,7 @@ class Encore { * will be used for any file types not passed. * * If you are using Encore.enableVersioning() - * make sure that your "js" filenames contain - * "[chunkhash]" and your "css" filenames contain + * make sure that your "js" and "css" filenames contain * "[contenthash]". * * @param {object} filenames diff --git a/lib/plugins/versioning.js b/lib/plugins/versioning.js index 76e2bc1d..aed474e9 100644 --- a/lib/plugins/versioning.js +++ b/lib/plugins/versioning.js @@ -10,6 +10,7 @@ 'use strict'; const webpack = require('webpack'); +const WebpackChunkHash = require('webpack-chunk-hash'); const PluginPriorities = require('./plugin-priorities'); /** @@ -20,7 +21,7 @@ const PluginPriorities = require('./plugin-priorities'); module.exports = function(plugins, webpackConfig) { /* - * With versioning, the "chunkhash" used in the filenames and + * With versioning, the "contenthash" used in the filenames and * the module ids (i.e. the internal names of modules that * are required) become important. Specifically: * @@ -31,19 +32,14 @@ module.exports = function(plugins, webpackConfig) { * * 2) Similarly, if the final contents of a file don't change, * then we also don't want that file to have a new filename. - * The WebpackChunkHash() handles this, by making sure that - * the chunkhash is based off of the file contents. - * - * Even in the webpack community, the ideal setup seems to be - * a bit of a mystery: - * * https://github.com/webpack/webpack/issues/1315 - * * https://github.com/webpack/webpack.js.org/issues/652#issuecomment-273324529 - * * https://webpack.js.org/guides/caching/#deterministic-hashes + * The "contenthash" handles this. */ if (webpackConfig.isProduction()) { // shorter, and obfuscated module ids (versus named modules) // makes the final assets *slightly* larger, but prevents contents // from sometimes changing when nothing really changed + // Note: Should not be needed in Webpack 5: + // https://github.com/webpack/webpack/pull/8276 plugins.push({ plugin: new webpack.HashedModuleIdsPlugin(), priority: PluginPriorities.HashedModuleIdsPlugin @@ -52,4 +48,12 @@ module.exports = function(plugins, webpackConfig) { // No plugin is added. But, see the "optimizations" config, // for inclusion of the "named modules". } + + if (webpackConfig.useVersioning) { + // enables the [chunkhash] ability, which is deprecated + plugins.push({ + plugin: new WebpackChunkHash(), + priority: PluginPriorities.WebpackChunkHash + }); + } }; diff --git a/package.json b/package.json index d8824834..f0393e3f 100644 --- a/package.json +++ b/package.json @@ -49,6 +49,7 @@ "terser-webpack-plugin": "^1.1.0", "tmp": "^0.0.33", "webpack": "^4.20.0", + "webpack-chunk-hash": "^0.6.0", "webpack-cli": "^3.0.0", "webpack-dev-server": "^3.1.4", "webpack-manifest-plugin": "^2.0.2", diff --git a/test/WebpackConfig.js b/test/WebpackConfig.js index 4c6793fd..07f05190 100644 --- a/test/WebpackConfig.js +++ b/test/WebpackConfig.js @@ -983,14 +983,14 @@ describe('WebpackConfig object', () => { it('Calling method sets it', () => { const config = createConfig(); config.configureFilenames({ - js: '[name].[chunkhash].js', + js: '[name].[contenthash].js', css: '[name].[contenthash].css', images: 'images/[name].[hash:8].[ext]', fonts: 'fonts/[name].[hash:8].[ext]' }); expect(config.configuredFilenames).to.deep.equals({ - js: '[name].[chunkhash].js', + js: '[name].[contenthash].js', css: '[name].[contenthash].css', images: 'images/[name].[hash:8].[ext]', fonts: 'fonts/[name].[hash:8].[ext]' diff --git a/test/config-generator.js b/test/config-generator.js index 1c556ab9..94216a99 100644 --- a/test/config-generator.js +++ b/test/config-generator.js @@ -199,7 +199,7 @@ describe('The config-generator function', () => { config.useVersioning = true; const actualConfig = configGenerator(config); - expect(actualConfig.output.filename).to.equal('[name].[chunkhash:8].js'); + expect(actualConfig.output.filename).to.equal('[name].[contenthash:8].js'); const miniCssPlugin = findPlugin(MiniCssExtractPlugin, actualConfig.plugins); diff --git a/test/functional.js b/test/functional.js index 0d6dfc7b..28d3abb5 100644 --- a/test/functional.js +++ b/test/functional.js @@ -387,7 +387,7 @@ describe('Functional tests using webpack', function() { config.enableVersioning(true); config.configureFilenames({ js: '[name].js?[chunkhash:16]', - css: '[name].css?[contenthash:16]' + css: '[name].css?[chunkhash:16]' }); testSetup.runWebpack(config, (webpackAssert) => { diff --git a/yarn.lock b/yarn.lock index 54db0b8f..a775e4b8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -738,6 +738,28 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-10.5.2.tgz#f19f05314d5421fe37e74153254201a7bf00a707" integrity sha512-m9zXmifkZsMHZBOyxZWilMwmTlpC8x5Ty360JKTiXvlXZfBWYpsg9ZZvP/Ye+iZUh+Q+MxDLjItVTWIsfwz+8Q== +"@types/tapable@*": + version "1.0.3" + resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.3.tgz#0db6e44f99933f9bfaa952ab9db9caa9ce4896e2" + integrity sha512-yz2OUW/HSKZnA2/hdxg5xoHxLbnzAbl1g5UW1eAJSYxVl2BmwKHt72w7Lfl4RU+BL/OWp/cGfSw+GPdN5kfqYg== + +"@types/uglify-js@*": + version "3.0.2" + resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.0.2.tgz#f30c75458d18e8ee885c792c04adcb78a13bc286" + integrity sha512-o8hU2+4xsyGC27Vujoklvxl88Ew5zmJuTBYMX1Uro2rYUt4HEFJKL6fuq8aGykvS+ssIsIzerWWP2DRxonownQ== + dependencies: + source-map "^0.6.1" + +"@types/webpack@^3.0.0 || ^4.0.0": + version "4.4.5" + resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.4.5.tgz#d45596fb67aeb724495ef5e7c78771bfc35f2955" + integrity sha512-CFRuLijysw6RK6ET+UozUMXO5DX57rXa7rYCr4h5pvI6YN6XQwIlyVNShGJpyRg3dWcoNfufTwH+HmjEcCkxRg== + dependencies: + "@types/node" "*" + "@types/tapable" "*" + "@types/uglify-js" "*" + source-map "^0.6.0" + "@vue/component-compiler-utils@^1.2.1": version "1.3.1" resolved "https://registry.yarnpkg.com/@vue/component-compiler-utils/-/component-compiler-utils-1.3.1.tgz#686f0b913d59590ae327b2a1cb4b6d9b931bbe0e" @@ -8722,6 +8744,13 @@ webidl-conversions@^2.0.0: resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-2.0.1.tgz#3bf8258f7d318c7443c36f2e169402a1a6703506" integrity sha1-O/glj30xjHRDw28uFpQCoaZwNQY= +webpack-chunk-hash@^0.6.0: + version "0.6.0" + resolved "https://registry.yarnpkg.com/webpack-chunk-hash/-/webpack-chunk-hash-0.6.0.tgz#eca36aff76e327d08a18a3e7990eb46e68376818" + integrity sha512-FsOg1RpW2nf3nYpGTy/Qs59RZ7gYG+sI4VrCE8TIBQYh/Kogi04xD39Pj9zUEeUcNx9HeTVPGSO3mtmpLeX9eQ== + dependencies: + "@types/webpack" "^3.0.0 || ^4.0.0" + webpack-cli@^3.0.0: version "3.0.8" resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-3.0.8.tgz#90eddcf04a4bfc31aa8c0edc4c76785bc4f1ccd9" From 95cbf85bd8e542476797ec805fbbb6baf539308c Mon Sep 17 00:00:00 2001 From: Ryan Weaver Date: Wed, 28 Nov 2018 11:26:48 -0500 Subject: [PATCH 3/4] fixing tests --- lib/WebpackConfig.js | 4 ++++ test/WebpackConfig.js | 17 +++++++++++++++++ test/functional.js | 16 ++++++++-------- 3 files changed, 29 insertions(+), 8 deletions(-) diff --git a/lib/WebpackConfig.js b/lib/WebpackConfig.js index 02511657..fe54add2 100644 --- a/lib/WebpackConfig.js +++ b/lib/WebpackConfig.js @@ -614,6 +614,10 @@ class WebpackConfig { } } + if (typeof configuredFilenames.js !== 'undefined' && configuredFilenames.js.includes('[chunkhash')) { + logger.deprecation('Using the [chunkhash] placeholder in any filenames is deprecated: use [contenthash] instead.'); + } + this.configuredFilenames = configuredFilenames; } diff --git a/test/WebpackConfig.js b/test/WebpackConfig.js index 07f05190..2bd7e8a3 100644 --- a/test/WebpackConfig.js +++ b/test/WebpackConfig.js @@ -1014,6 +1014,23 @@ describe('WebpackConfig object', () => { }); }).to.throw('"foo" is not a valid key'); }); + + it('Using chunkhash is deprecated', () => { + logger.reset(); + logger.quiet(); + + after(() => { + logger.quiet(false); + }); + + const config = createConfig(); + + config.configureFilenames({ + js: 'file.[chunkhash:16].js' + }); + + expect(logger.getMessages().deprecation).to.not.be.empty; + }); }); describe('configureUrlLoader', () => { diff --git a/test/functional.js b/test/functional.js index 28d3abb5..482a048c 100644 --- a/test/functional.js +++ b/test/functional.js @@ -356,11 +356,11 @@ describe('Functional tests using webpack', function() { testSetup.runWebpack(config, (webpackAssert) => { expect(config.outputPath).to.be.a.directory() .with.files([ - 'main.f1e0a935.js', + 'main.89eb104b.js', 'styles.8ec31654.css', 'manifest.json', 'entrypoints.json', - 'runtime.d41d8cd9.js', + 'runtime.3d179b24.js', ]); webpackAssert.assertOutputFileContains( @@ -457,14 +457,14 @@ describe('Functional tests using webpack', function() { testSetup.runWebpack(config, (webpackAssert) => { expect(config.outputPath).to.be.a.directory() .with.files([ - '0.8256b1ad.js', // chunks are also versioned + '0.590a68c7.js', // chunks are also versioned '0.8ec31654.css', - 'main.ba427376.js', + 'main.4a5effdb.js', 'h1.8ec31654.css', 'bg.0ec2735b.css', 'manifest.json', 'entrypoints.json', - 'runtime.d41d8cd9.js', + 'runtime.b84a9b43.js', ]); expect(path.join(config.outputPath, 'images')).to.be.a.directory() @@ -1591,8 +1591,8 @@ module.exports = { expect(config.outputPath).to.be.a.directory() .with.files([ 'entrypoints.json', - 'runtime.d41d8cd9.js', - 'main.1172d977.js', + 'runtime.21aa1db9.js', + 'main.22bad391.js', 'manifest.json', 'symfony_logo.ea1ca6f7.png', 'symfony_logo_alt.f27119c2.png', @@ -1605,7 +1605,7 @@ module.exports = { webpackAssert.assertManifestPath( 'build/main.js', - '/build/main.1172d977.js' + '/build/main.22bad391.js' ); webpackAssert.assertManifestPath( From d25b961a8b917fed33aaacc3ed7f9e1c1abefa3f Mon Sep 17 00:00:00 2001 From: Ryan Weaver Date: Wed, 28 Nov 2018 13:19:49 -0500 Subject: [PATCH 4/4] Fixing test --- test/functional.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/functional.js b/test/functional.js index 482a048c..012649b9 100644 --- a/test/functional.js +++ b/test/functional.js @@ -403,7 +403,7 @@ describe('Functional tests using webpack', function() { ); webpackAssert.assertManifestPath( 'styles.css', - '/styles.css?8ec316547cc77b39' + '/styles.css?91597a40238e0e66' ); done();