From caad985abca6450d56ca3d4e27e1e859fe8909b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Thu, 23 Jan 2025 22:16:01 +0900 Subject: [PATCH] feat(css): add friendly errors for IE hacks that are not supported by lightningcss (#19072) --- packages/vite/src/node/plugins/css.ts | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index 12207db233b406..3f1f6e528650ff 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -3243,6 +3243,25 @@ async function compileLightningCSS( line: e.loc.line, column: e.loc.column - 1, // 1-based } + // add friendly error for https://github.com/parcel-bundler/lightningcss/issues/39 + try { + const code = fs.readFileSync(e.fileName, 'utf-8') + const commonIeMessage = + ', which was used in the past to support old Internet Explorer versions.' + + ' This is not a valid CSS syntax and will be ignored by modern browsers. ' + + '\nWhile this is not supported by LightningCSS, you can set `css.lightningcss.errorRecovery: true` to strip these codes.' + if (/[\s;{]\*[a-zA-Z-][\w-]+\s*:/.test(code)) { + // https://stackoverflow.com/a/1667560 + e.message += + '.\nThis file contains star property hack (e.g. `*zoom`)' + + commonIeMessage + } else if (/min-width:\s*0\\0/.test(code)) { + // https://stackoverflow.com/a/14585820 + e.message += + '.\nThis file contains @media zero hack (e.g. `@media (min-width: 0\\0)`)' + + commonIeMessage + } + } catch {} } throw e }