add support for [hash] in filename #257

dotch · 2016-03-16T00:23:56Z

This PR adds support for replacing [hash] in the filename with the hash of the compiled template.

This behavior was brought up in #121 and would be pretty helpful for me.

dotch · 2016-03-16T00:26:02Z

index.js

@@ -37,7 +37,7 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {

  compiler.plugin('make', function (compilation, callback) {
    // Compile the template (queued)
-    compilationPromise = childCompiler.compileTemplate(self.options.template, compiler.context, self.options.filename, compilation)
+    compilationPromise = childCompiler.compileTemplate(self.options.template, compiler.context, 'template', compilation)


The filename was replaced here, because the child compiler would otherwise replace the [hash] by itself, causing an error. The actual provided filename for this function seems to not matter and be a temporary thing anyway. Please correct me if my assumption is wrong.

Webpack will overwrite an existing file with the name 'template'. This could also conflict if you would have two instances of the webpack-html-plugin.

Hm I guess that makes my approach rather pointless. We can not hand in the filename with the hash before we even have compiled the template.

jantimon · 2016-03-17T06:07:54Z

Is this different from #249?

dotch · 2016-03-17T09:20:08Z

Yes, this PR targets the output html file, #249 targets the included assets.
An example usage for this PR would be:

new HtmlWebpackPlugin({
      template: 'index.html.template',
      filename: 'build/index-[hash].html',
}),

[hash] would then be replaced with the hash of the compiled template.
This is useful in cases where the final output html is by itself only an asset that also needs cache busting. E.g. when using it as an iFrame or with html-imports.

jantimon · 2016-03-17T23:58:39Z

index.js

@@ -48,6 +48,7 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
        // If the compilation change didnt change the cache is valid
        isCompilationCached = compilationResult.hash && self.childCompilerHash === compilationResult.hash;
        self.childCompilerHash = compilationResult.hash;
+        self.options.filename = self.options.filename.replace(/\[hash\]/g, compilationResult.hash);


Do we have to change the user options here?

We could store the filename in a different property such as this.modifiedFilename and leave the options untouched for clarity.

Can't we just use self.childCompilerHash ?

dotch · 2016-03-18T21:54:28Z

I added a commit using self.childCompilerHash to build the filename at the position where it gets used.

jantimon · 2016-03-24T19:32:30Z

Looks quite good - however I am still not sure about the hardcoded template name.
It might cause issues with recompilation and caching.
Could we instead just escape the template name?

Maybe you could also add a test to the caching spec.

dotch · 2016-03-24T19:37:33Z

Agree with both of your points. Will address them and document the functionality in the readme.

dotch · 2016-04-01T01:47:46Z

@jantimon Mind having another look at this?
I 'escape' the filename before handing it to the child compiler, by just removing [hash] from the String.
I added a test for correct handling of [hash] in the output file name.
And I run the whole caching spec suite with a [hash] in the filename.
Sorry for the massive diff due to the indentation change in CachingSpec.js.

krukid · 2016-04-01T10:41:42Z

@dotch This PR is exactly what I need for an IFrame, but one thing is not clear to me: when the plugin generates a hash-based file name, how do I get it programmatically? I mean ideally, I could just require(file_name) (or template_name?) and get the compiled HTML asset URL, but something tells me that is not how it works. Am I wrong?

jantimon · 2016-04-01T12:43:31Z

Could you please revert the indentation change - it's really impossible to read otherwise.

dotch · 2016-04-01T17:24:09Z

@jantimon
Sorry about that. I reverted the whitespace changes and put them in a second commit for now.

jantimon · 2016-04-02T06:16:12Z

Looks like it is still broken

jantimon · 2016-04-02T06:22:37Z

index.js

@@ -43,8 +43,12 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
  }

  compiler.plugin('make', function (compilation, callback) {
+    // Remove occurences of '[hash]' in the filename so the child
+    // compiler does not try to replace it.
+    var escapedFilename = self.options.filename.replace('[hash]', '');


Wouldnt it be better to replace [ and ] to reduce the chance of collisions and support also other webpack variables?

We could move the escaping to a small file in the library folder which does only the webpack filename escaping and unescaping.

What about [ -> {[{ and ] -> }]} ?

Should still be a valid filename: https://en.wikipedia.org/wiki/Filename

jantimon · 2016-04-02T07:34:22Z

After some research I tried to use the webpack way of handling the filename: #279.
What do you think?

dotch · 2016-04-06T18:27:49Z

Looks good to me, I like that approach!

jantimon · 2016-04-07T15:37:48Z

Moved to #279

lock · 2018-05-31T14:18:15Z

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

dotch reviewed Mar 16, 2016
View reviewed changes

jantimon reviewed Mar 17, 2016
View reviewed changes

dotch force-pushed the master branch from 0aa00ba to ae2d596 Compare March 18, 2016 21:52

dotch force-pushed the master branch 2 times, most recently from f56103a to 3287c5a Compare April 1, 2016 01:39

dotch force-pushed the master branch from 3287c5a to 10c7189 Compare April 1, 2016 17:22

cweiss-stripe added 2 commits April 1, 2016 10:34

add support for [hash] in filename

af66738

fix whitespace in caching spec

67f3574

dotch force-pushed the master branch from 10c7189 to 67f3574 Compare April 1, 2016 17:35

jantimon reviewed Apr 2, 2016
View reviewed changes

jantimon mentioned this pull request Apr 2, 2016

Support hashes in filenames #279

Merged

jantimon closed this Apr 7, 2016

lock bot locked as resolved and limited conversation to collaborators May 31, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

add support for [hash] in filename #257

add support for [hash] in filename #257

dotch commented Mar 16, 2016

dotch Mar 16, 2016

jantimon Mar 17, 2016

dotch Mar 18, 2016

jantimon commented Mar 17, 2016

dotch commented Mar 17, 2016

jantimon Mar 17, 2016

dotch Mar 18, 2016

jantimon Mar 18, 2016

dotch commented Mar 18, 2016

jantimon commented Mar 24, 2016

dotch commented Mar 24, 2016

dotch commented Apr 1, 2016

krukid commented Apr 1, 2016

jantimon commented Apr 1, 2016

dotch commented Apr 1, 2016

jantimon commented Apr 2, 2016

jantimon Apr 2, 2016

jantimon commented Apr 2, 2016

dotch commented Apr 6, 2016

jantimon commented Apr 7, 2016

lock bot commented May 31, 2018

add support for [hash] in filename #257

add support for [hash] in filename #257

Conversation

dotch commented Mar 16, 2016

dotch Mar 16, 2016

Choose a reason for hiding this comment

jantimon Mar 17, 2016

Choose a reason for hiding this comment

dotch Mar 18, 2016

Choose a reason for hiding this comment

jantimon commented Mar 17, 2016

dotch commented Mar 17, 2016

jantimon Mar 17, 2016

Choose a reason for hiding this comment

dotch Mar 18, 2016

Choose a reason for hiding this comment

jantimon Mar 18, 2016

Choose a reason for hiding this comment

dotch commented Mar 18, 2016

jantimon commented Mar 24, 2016

dotch commented Mar 24, 2016

dotch commented Apr 1, 2016

krukid commented Apr 1, 2016

jantimon commented Apr 1, 2016

dotch commented Apr 1, 2016

jantimon commented Apr 2, 2016

jantimon Apr 2, 2016

Choose a reason for hiding this comment

jantimon commented Apr 2, 2016

dotch commented Apr 6, 2016

jantimon commented Apr 7, 2016

lock bot commented May 31, 2018