1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-04-06 01:15:28 +02:00

chore: add file and component names to styled output class names in dev (#9351)

Updates the `vite.config.mts` file to include config for emotion,
telling it to add `<file name>--<component name>` to the class names
of generated components.

The class name modification only happens in development mode.
This commit is contained in:
Thomas Heartman 2025-02-24 14:45:20 +01:00 committed by GitHub
parent 7f81c38daa
commit 26e01177be
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -37,8 +37,40 @@ const vitestConfig = vitestDefineConfig({
},
});
export default mergeConfig(
defineConfig({
export default defineConfig(({ mode }) => {
const reactPluginArgs =
mode === 'development'
? {
babel: {
plugins: [
[
'@emotion',
{
autoLabel: 'always',
labelFormat: '[filename]--[local]',
importMap: {
'@mui/material': {
styled: {
canonicalImport: [
'@emotion/styled',
'default',
],
styledBaseImport: [
'@mui/material',
'styled',
],
},
},
},
},
],
],
},
}
: undefined;
return mergeConfig(
{
base: UNLEASH_BASE_PATH,
build: {
outDir: 'build',
@ -81,10 +113,16 @@ export default mergeConfig(
allow: ['..'],
},
},
plugins: [react(), tsconfigPaths(), svgr(), envCompatible()],
plugins: [
react(reactPluginArgs),
tsconfigPaths(),
svgr(),
envCompatible(),
],
esbuild: {
logOverride: { 'this-is-undefined-in-esm': 'silent' },
},
}),
},
vitestConfig,
);
});