feat: allow adding a hash in generated font file name (@brunoroux)

Merge branch 'add_hash_generated_filename' of https://github.com/brunoroux/webfont into brunoroux-add_hash_generated_filename
itgalaxy · Sep 29, 2020 · 1913c9a · 1913c9a
2 parents 9206e72 + c7f6882
commit 1913c9a
Show file tree

Hide file tree

Showing 6 changed files with 53 additions and 19 deletions.
diff --git a/src/__tests__/standalone.test.js b/src/__tests__/standalone.test.js
@@ -390,4 +390,16 @@ describe("standalone", () => {
     expect(Array.isArray(result.glyphsData)).toBe(true);
     expect(result.glyphsData.length > 0).toBe(true);
   });
+
+  it("should export `hash` in `result`", () => {
+    expect.assertions(1);
+
+    return standalone({
+      files: `${fixturesGlob}/svg-icons/**/*`
+    }).then(result => {
+      expect(result.hash).toBe("ead2b6f69fc603bf1cbd00bf9f8a8a33");
+
+      return result;
+    });
+  });
 });
diff --git a/src/cli.js b/src/cli.js
@@ -131,6 +131,10 @@ const cli = meow(
         --metadata
 
             Content of the metadata tag.
+            
+        --add-hash-in-font-url
+          
+            Generated font url will be : [webfont].[ext]?v=[hash]
 `,
   {
     autoHelp: false,
@@ -215,6 +219,10 @@ const cli = meow(
         alias: "p",
         type: "string"
       },
+      "add-hash-in-font-url": {
+        default: false,
+        type: "boolean"
+      },
       verbose: {
         default: false,
         type: "boolean"
@@ -333,6 +341,10 @@ if (cli.flags.sort === false) {
   optionsBase.sort = cli.flags.sort;
 }
 
+if (cli.flags.addHashInFontUrl) {
+  optionsBase.addHashInFontUrl = cli.flags.addHashInFontUrl;
+}
+
 if (cli.flags.help || cli.flags.h) {
   cli.showHelp();
 }
@@ -387,6 +399,8 @@ Promise.resolve()
           path.basename(result.config.template).replace(".njk", "")
         );
       }
+
+      delete result.hash;
     }
 
     return Promise.resolve()

diff --git a/src/standalone.js b/src/standalone.js
@@ -1,6 +1,7 @@
 import { Readable } from "stream";
 import fs from "fs";
 import path from "path";
+import crypto from "crypto";
 import SVGIcons2SVGFontStream from "svgicons2svgfont";
 import cosmiconfig from "cosmiconfig";
 import pLimit from "p-limit";
@@ -244,6 +245,11 @@ export default async function(initialOptions) {
       : {}
   );
 
+  result.hash = crypto
+    .createHash("md5")
+    .update(result.svg)
+    .digest("hex");
+
   if (options.formats.includes("eot")) {
     result.eot = toEot(result.ttf);
   }
@@ -283,6 +289,7 @@ export default async function(initialOptions) {
       templateFilePath = path.resolve(resolvedTemplateFilePath);
     }
 
+    const hashOption = options.addHashInFontUrl ? { hash: result.hash } : {};
     const nunjucksOptions = deepmerge.all([
       {
         glyphs: result.glyphsData.map(glyphData => {
@@ -298,7 +305,8 @@ export default async function(initialOptions) {
         className: options.templateClassName || options.fontName,
         fontName: options.templateFontName || options.fontName,
         fontPath: options.templateFontPath.replace(/\/?$/, "/")
-      }
+      },
+      hashOption
     ]);
 
     result.template = nunjucks.render(templateFilePath, nunjucksOptions);

diff --git a/templates/template.css.njk b/templates/template.css.njk
@@ -4,35 +4,35 @@
   font-weight: 400;
   font-display: auto;
   {% if formats.indexOf('eot')>-1 -%}
-    src: url("{{ fontPath }}{{ fontName }}.eot");
+    src: url("{{ fontPath }}{{ fontName }}.eot{% if hash %}?v={{ hash }}{% endif %}");
   {%- endif %}
   {%- set eotIndex = formats.indexOf('eot') -%}
   {%- set woff2Index = formats.indexOf('woff2') -%}
   {%- set woffIndex = formats.indexOf('woff') -%}
   {%- set ttfIndex = formats.indexOf('ttf') -%}
   {%- set svgIndex = formats.indexOf('svg') %}
   src: {% if eotIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.eot?#iefix") format("embedded-opentype")
+    url("{{ fontPath }}{{ fontName }}.eot?{% if hash %}v={{ hash }}{% endif %}#iefix") format("embedded-opentype")
     {%- set nothing = formats.splice(eotIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if woff2Index != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.woff2") format("woff2")
+    url("{{ fontPath }}{{ fontName }}.woff2{% if hash %}?v={{ hash }}{% endif %}") format("woff2")
     {%- set nothing = formats.splice(woff2Index, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if woffIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.woff") format("woff")
+    url("{{ fontPath }}{{ fontName }}.woff{% if hash %}?v={{ hash }}{% endif %}") format("woff")
     {%- set nothing = formats.splice(woffIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if ttfIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.ttf") format("truetype")
+    url("{{ fontPath }}{{ fontName }}.ttf{% if hash %}?v={{ hash }}{% endif %}") format("truetype")
     {%- set nothing = formats.splice(ttfIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if svgIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.svg#{{ fontName }}") format("svg");
+    url("{{ fontPath }}{{ fontName }}.svg{% if hash %}?v={{ hash }}{% endif %}#{{ fontName }}") format("svg");
   {%- endif %}
 }
 

diff --git a/templates/template.html.njk b/templates/template.html.njk
@@ -51,35 +51,35 @@
         font-weight: 400;
         font-display: auto;
         {% if formats.indexOf('eot')>-1 -%}
-          src: url("{{ fontPath }}{{ fontName }}.eot");
+          src: url("{{ fontPath }}{{ fontName }}.eot{% if hash %}?v={{ hash }}{% endif %}");
         {%- endif %}
         {%- set eotIndex = formats.indexOf('eot') -%}
         {%- set woff2Index = formats.indexOf('woff2') -%}
         {%- set woffIndex = formats.indexOf('woff') -%}
         {%- set ttfIndex = formats.indexOf('ttf') -%}
         {%- set svgIndex = formats.indexOf('svg') %}
         src: {% if eotIndex != -1 -%}
-          url("{{ fontPath }}{{ fontName }}.eot?#iefix") format("embedded-opentype")
+          url("{{ fontPath }}{{ fontName }}.eot?{% if hash %}v={{ hash }}{% endif %}#iefix") format("embedded-opentype")
           {%- set nothing = formats.splice(eotIndex, 1) -%}
           {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
         {%- endif -%}
         {%- if woff2Index != -1 -%}
-          url("{{ fontPath }}{{ fontName }}.woff2") format("woff2")
+          url("{{ fontPath }}{{ fontName }}.woff2{% if hash %}?v={{ hash }}{% endif %}") format("woff2")
           {%- set nothing = formats.splice(woff2Index, 1) -%}
           {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
         {%- endif -%}
         {%- if woffIndex != -1 -%}
-          url("{{ fontPath }}{{ fontName }}.woff") format("woff")
+          url("{{ fontPath }}{{ fontName }}.woff{% if hash %}?v={{ hash }}{% endif %}") format("woff")
           {%- set nothing = formats.splice(woffIndex, 1) -%}
           {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
         {%- endif -%}
         {%- if ttfIndex != -1 -%}
-          url("{{ fontPath }}{{ fontName }}.ttf") format("truetype")
+          url("{{ fontPath }}{{ fontName }}.ttf{% if hash %}?v={{ hash }}{% endif %}") format("truetype")
           {%- set nothing = formats.splice(ttfIndex, 1) -%}
           {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
         {%- endif -%}
         {%- if svgIndex != -1 -%}
-          url("{{ fontPath }}{{ fontName }}.svg#{{ fontName }}") format("svg");
+          url("{{ fontPath }}{{ fontName }}.svg{% if hash %}?v={{ hash }}{% endif %}#{{ fontName }}") format("svg");
         {%- endif %}
       }
 

diff --git a/templates/template.scss.njk b/templates/template.scss.njk
@@ -8,35 +8,35 @@
   font-weight: 400;
   font-display: auto;
   {% if formats.indexOf('eot')>-1 -%}
-    src: url("{{ fontPath }}{{ fontName }}.eot");
+    src: url("{{ fontPath }}{{ fontName }}.eot{% if hash %}?v={{ hash }}{% endif %}");
   {%- endif -%}
   {%- set eotIndex = formats.indexOf('eot') -%}
   {%- set woff2Index = formats.indexOf('woff2') -%}
   {%- set woffIndex = formats.indexOf('woff') -%}
   {%- set ttfIndex = formats.indexOf('ttf') -%}
   {%- set svgIndex = formats.indexOf('svg') %}
   src: {% if eotIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.eot?#iefix") format("embedded-opentype")
+    url("{{ fontPath }}{{ fontName }}.eot?{% if hash %}v={{ hash }}{% endif %}#iefix") format("embedded-opentype")
     {%- set nothing = formats.splice(eotIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if woff2Index != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.woff2") format("woff2")
+    url("{{ fontPath }}{{ fontName }}.woff2{% if hash %}?v={{ hash }}{% endif %}") format("woff2")
     {%- set nothing = formats.splice(woff2Index, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if woffIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.woff") format("woff")
+    url("{{ fontPath }}{{ fontName }}.woff{% if hash %}?v={{ hash }}{% endif %}") format("woff")
     {%- set nothing = formats.splice(woffIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if ttfIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.ttf") format("truetype")
+    url("{{ fontPath }}{{ fontName }}.ttf{% if hash %}?v={{ hash }}{% endif %}") format("truetype")
     {%- set nothing = formats.splice(ttfIndex, 1) -%}
     {%- if formats.length != 0 -%}, {% else -%}; {% endif -%}
   {%- endif -%}
   {%- if svgIndex != -1 -%}
-    url("{{ fontPath }}{{ fontName }}.svg#{{ fontName }}") format("svg");
+    url("{{ fontPath }}{{ fontName }}.svg{% if hash %}?v={{ hash }}{% endif %}#{{ fontName }}") format("svg");
   {%- endif %}
 }