e8fbfb14c1
Add coexistence checks to all enqueue methods to prevent loading both React and Grid.js assets simultaneously. Changes: - ReactAdmin.php: Only enqueue React assets when ?react=1 - Init.php: Skip Grid.js when React active on admin pages - Form.php, Coupon.php, Access.php: Restore classic assets when ?react=0 - Customer.php, Product.php, License.php: Add coexistence checks Now the toggle between Classic and React versions works correctly. Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
1.4 KiB
1.4 KiB
webpack
Removing unused languages from dynamic import
If a locale is imported dynamically, then all locales from date-fns are loaded by webpack into a bundle (~160kb) or split across the chunks. This prolongs the build process and increases the amount of space taken. However, it is possible to use webpack to trim down languages using ContextReplacementPlugin.
Let's assume that we have a single point in which supported locales are present:
config.js:
// `see date-fns/src/locale` for available locales
export const supportedLocales = ['en-US', 'de', 'pl', 'it']
We could also have a function that formats the date:
const getLocale = (locale) => import(`date-fns/locale/${locale}/index.js`) // or require() if using CommonJS
const formatDate = (date, formatStyle, locale) => {
return format(date, formatStyle, {
locale: getLocale(locale),
})
}
In order to exclude unused languages we can use webpacks ContextReplacementPlugin.
webpack.config.js:
import webpack from 'webpack'
import { supportedLocales } from './config.js'
export default const config = {
plugins: [
new webpack.ContextReplacementPlugin(
/^date-fns[/\\]locale$/,
new RegExp(`\\.[/\\\\](${supportedLocales.join('|')})[/\\\\]index\\.js$`)
)
]
}
This results in a language bundle of ~23kb .