Expose settings to control the minification process(es)

🚀 Feature

As a user I’d like to have more control over the minification process.

We have a Docusarus blog that we also use as a source to send email newsletters (about 500k). I’ve noticed that some screenshots are inlined as img src="data:image/png;base64,...". I’m guessing this is based on file size.

As I do not want to have the images in the payload in each email, I’d like to not have them inlined.

Have you read the Contributing Guidelines on issues?

Yes.

Has this been requested on Canny?

No.

Motivation

It’s nice to have some control over the minification process to support different use cases.

API Design

It would be nice to have some optional settings exposed for overriding the default behavior either in Docusaurus config or in the webpack config.

Have you tried building it?

Someone suggested building a remark plugin which seems overly complicated to me, but I’ll check it out.

[stnor]

Yeah absolutely. The PR solves my issue. In the mean time I will hack the value in node_modules.

Again, I would advise to lower the default inlining threshold to 2k or less in order to align with web perf best practices, but this fix lets me override the (imho) broken default via the env, so I’m happy with this.

[lex111]

Images in blog content are handled by inlineMarkdownImageFileLoader, whose options cannot be overridden via configureWebpack for now. If it will be “regular loader”, you could do something similar with the existing API:

configureWebpack(_config, isServer) {
  _config.module.rules[0].use[0].options.limit = false;

  return {
    mergeStrategy: {
      'module.rules': 'prepend',
    },
    module: {
      rules: [_config.module.rules[0]],
    },
  };
},

Perhaps this will be possible after migrating to asset modules in PR #4708, although the CRA approach by changing env var still looks better and clearer than using configureWebpack which seems pretty hacky.