Apologies for this being a non-answer, but hopefully it saves some time.
MomentJS have been aware of their size for a while, and have taken steps to try to structure their project so it can be stripped down better. They have structured their project, so that the locales are stored separately.
However the trick here is you mentioned CreateReact4, you are not testing this in a clean room, so anything could be taking effect.
Create React 4 document that:
Troubleshooting.md - MomentJS Locales are Missing
If you use a Moment.js, you might notice that only the English locale
is available by default. This is because the locale files are large,
and you probably only need a subset of all the locales provided by
Moment.js.
To add a specific Moment.js locale to your bundle, you need to import
it explicitly.
This is because CreateReact4 is configured by default to remove the locales
react-scripts/config/webpack.config.js#L671-L678
// Moment.js is an extremely popular library that bundles large locale files
// by default due to how webpack interprets its code. This is a practical
// solution that requires the user to opt into importing specific locales.
// https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
// You can remove this if you don't use Moment.js:
new webpack.IgnorePlugin({
resourceRegExp: /^\.\/locale$/,
contextRegExp: /moment$/,
}),
It's possible you could trim it further using the plugin you mentioned in the question (Have you checked if it's even being invoked / compatible anymore?), but the bulk of the gzipped data really is the locales, not the timezone data, (TZ don't compress as easily).
Moment TZ Data Plugin state on their site that depending on the config gives various savings.
Default 1164 KiB 105 KiB
Strip locales 959 KiB (~82%) 56 KiB (~53%)
Strip tz data 265 KiB (~23%) 69 KiB (~66%)
Strip locales & tz data 60 KiB (~5%) 20 KiB (~19%)
So CreateReact4's default behaviour of stripping un-needed locales, likely gives a 53% reduction by default(gzipped).
However you state that Moment-js is using 7k... so whilst this is a good breakdown of what could be happening, there's clearly something further at play, even moment.js-min is 18kb.
importyou're using? Presumably the answer is tree shaking but I don't see how moment-timezone would be tree-shakable without the plugin... – Insolation