patrickhulce / fontmin-webpack

Minifies icon fonts to just the used glyphs.
MIT License
139 stars 19 forks source link

Some files are not minified when using ExtractTextPlugin #14

Closed mochiya98 closed 3 years ago

mochiya98 commented 5 years ago

Note

It's already fixed partially.
refs: #13

Why does it happen?

when using ExtractTextPlugin, compilation.modules is changed.

without ExtractTextPlugin:

compilation.modules: [
    {
        buildInfo: {
            assets: {
                '674f50d287a8c48dc19ba404d20fe713.woff': RawSource {}
            },
            fileDependencies: Set {
                '/**/fontawesome-webfont.woff'
            }
        }
    },
    {
        buildInfo: {
            assets: {
                'af7ae505a9eed503f8b8e6982036873e.ttf': RawSource {}
            },
            fileDependencies: Set {
                '/**/fontawesome-webfont.ttf'
            }
        }
    }
]

findRegularFontFiles__old(compilation): //same
findRegularFontFiles__fixed(compilation): [
    {asset, extension: ".woff", font: "fontawesome-webfont", buffer},
    {asset, extension: ".ttf", font: "fontawesome-webfont", buffer}
]

with ExtractTextPlugin:

compilation.modules: [
    {
        buildInfo: {
            assets: {
                '674f50d287a8c48dc19ba404d20fe713.woff': RawSource {},
                'af7ae505a9eed503f8b8e6982036873e.ttf': RawSource {}
            },
            fileDependencies: Set {
                '/**/entry.css',
                '/**/font-awesome.css',
                '/**/fontawesome-webfont.woff',
                '/**/fontawesome-webfont.ttf'
            }
        }
    },
]
findRegularFontFiles__old(compilation): [
    {asset, extension: ".woff", font: "entry.css", buffer}
    // first asset only! extension is not removed!
]
findRegularFontFiles__fixed(compilation): [
    {asset, extension: ".woff", font: "entry", buffer},
    {asset, extension: ".ttf", font: "entry", buffer}
]

What problem will this cause?

with ExtractTextPlugin:

findRegularFontFiles__old(compilation): [
    {asset, extension: ".woff2", font: "entry.css", buffer}
    // first asset only! extension is not removed!
]
findRegularFontFiles__fixed(compilation): [
    {asset, extension: ".woff2", font: "entry", buffer},
    {asset, extension: ".woff", font: "entry", buffer},
    {asset, extension: ".ttf", font: "entry", buffer}
]

findFontFiles__old(compilation): [
    {asset, extension: ".woff2", font: "entry.css", buffer}, // not minified! :(
    {asset, extension: ".woff", font: "fontawesome-webfont", buffer}, // minified
    {asset, extension: ".ttf", font: "fontawesome-webfont", buffer} // minified
]

findFontFiles__fixed(compilation): [
    {asset, extension: ".woff2", font: "entry", buffer}, // minified
    {asset, extension: ".woff", font: "entry", buffer}, // minified
    {asset, extension: ".ttf", font: "entry", buffer} // minified
]

Is it solved completely in the current version(2.0.2) ?

no.

Problems will occur in the following cases:

uh, maybe these problems will be solved in the following ways:

  findFontFiles(compilation) {
    const regular = this.findRegularFontFiles(compilation)
    const extract = this.findExtractTextFontFiles(compilation)
-    return _.uniqBy(regular.concat(extract), 'asset')
+    return _.uniqBy(extract.concat(regular), 'asset')
  }

...isn't it?

patrickhulce commented 5 years ago

IIUC the problem is that findRegularFontFiles finds font files that get preferred over the correct ExtractText ones?

If that's true, I think we could be a bit more explicit with a fix and say something like

// Prefer the ExtractTextPlugin version of any assets we find
const regularWithExtractRemoved = _.differenceBy(regular, extract, 'asset')
return _.uniqBy(regularWithExtractRemoved.concat(extract), 'asset')
Moustachos commented 3 years ago

Hello @patrickhulce,

Thanks for the great work on this plugin!

I'm currently experiencing a bug where some glyphs aren't bundled in final font files when they're present in several font variations (I'm trying to minify FontAwesome).

I'm building with Webpack 5 & v3.0.1 of your plugin.

With master branch code, glyphs are added in fa-light-XXX files, but not in fa-solid, fa-regular etc. files.

With @mochiya98's fix or yours, glyphs are properly added to each FontAwesome variation files.

Could you push this fix on master?

Thanks :)

patrickhulce commented 3 years ago

Ah, sure @Moustachos I'll push that later today 👍