@@ -312,7 +312,7 @@ export function cssPlugin(config: ResolvedConfig): Plugin {
312312 } )
313313 }
314314
315- const plugin : Plugin = {
315+ return {
316316 name : 'vite:css' ,
317317
318318 buildStart ( ) {
@@ -362,93 +362,84 @@ export function cssPlugin(config: ResolvedConfig): Plugin {
362362 }
363363 } ,
364364 } ,
365- }
365+ transform : {
366+ async handler ( raw , id ) {
367+ if (
368+ ! isCSSRequest ( id ) ||
369+ commonjsProxyRE . test ( id ) ||
370+ SPECIAL_QUERY_RE . test ( id )
371+ ) {
372+ return
373+ }
366374
367- const transformHook : Plugin [ 'transform' ] = {
368- async handler ( raw , id ) {
369- if (
370- ! isCSSRequest ( id ) ||
371- commonjsProxyRE . test ( id ) ||
372- SPECIAL_QUERY_RE . test ( id )
373- ) {
374- return
375- }
375+ const { environment } = this
376+ const resolveUrl = ( url : string , importer ?: string ) =>
377+ idResolver ( environment , url , importer )
376378
377- const { environment } = this
378- const resolveUrl = ( url : string , importer ?: string ) =>
379- idResolver ( environment , url , importer )
379+ const urlResolver : CssUrlResolver = async ( url , importer ) => {
380+ const decodedUrl = decodeURI ( url )
381+ if ( checkPublicFile ( decodedUrl , config ) ) {
382+ if ( encodePublicUrlsInCSS ( config ) ) {
383+ return [ publicFileToBuiltUrl ( decodedUrl , config ) , undefined ]
384+ } else {
385+ return [ joinUrlSegments ( config . base , decodedUrl ) , undefined ]
386+ }
387+ }
388+ const [ id , fragment ] = decodedUrl . split ( '#' )
389+ let resolved = await resolveUrl ( id , importer )
390+ if ( resolved ) {
391+ if ( fragment ) resolved += '#' + fragment
392+ return [ await fileToUrl ( this , resolved ) , resolved ]
393+ }
394+ if ( config . command === 'build' ) {
395+ const isExternal = config . build . rollupOptions . external
396+ ? resolveUserExternal (
397+ config . build . rollupOptions . external ,
398+ decodedUrl , // use URL as id since id could not be resolved
399+ id ,
400+ false ,
401+ )
402+ : false
380403
381- const urlResolver : CssUrlResolver = async ( url , importer ) => {
382- const decodedUrl = decodeURI ( url )
383- if ( checkPublicFile ( decodedUrl , config ) ) {
384- if ( encodePublicUrlsInCSS ( config ) ) {
385- return [ publicFileToBuiltUrl ( decodedUrl , config ) , undefined ]
386- } else {
387- return [ joinUrlSegments ( config . base , decodedUrl ) , undefined ]
404+ if ( ! isExternal ) {
405+ // #9800 If we cannot resolve the css url, leave a warning.
406+ config . logger . warnOnce (
407+ `\n${ decodedUrl } referenced in ${ id } didn't resolve at build time, it will remain unchanged to be resolved at runtime` ,
408+ )
409+ }
388410 }
411+ return [ url , undefined ]
389412 }
390- const [ id , fragment ] = decodedUrl . split ( '#' )
391- let resolved = await resolveUrl ( id , importer )
392- if ( resolved ) {
393- if ( fragment ) resolved += '#' + fragment
394- return [ await fileToUrl ( this , resolved ) , resolved ]
413+
414+ const {
415+ code : css ,
416+ modules,
417+ deps,
418+ map,
419+ } = await compileCSS (
420+ environment ,
421+ id ,
422+ raw ,
423+ preprocessorWorkerController ! ,
424+ urlResolver ,
425+ )
426+ if ( modules ) {
427+ moduleCache . set ( id , modules )
395428 }
396- if ( config . command === 'build' ) {
397- const isExternal = config . build . rollupOptions . external
398- ? resolveUserExternal (
399- config . build . rollupOptions . external ,
400- decodedUrl , // use URL as id since id could not be resolved
401- id ,
402- false ,
403- )
404- : false
405429
406- if ( ! isExternal ) {
407- // #9800 If we cannot resolve the css url, leave a warning.
408- config . logger . warnOnce (
409- `\n${ decodedUrl } referenced in ${ id } didn't resolve at build time, it will remain unchanged to be resolved at runtime` ,
410- )
430+ if ( deps ) {
431+ for ( const file of deps ) {
432+ this . addWatchFile ( file )
411433 }
412434 }
413- return [ url , undefined ]
414- }
415435
416- const {
417- code : css ,
418- modules,
419- deps,
420- map,
421- } = await compileCSS (
422- environment ,
423- id ,
424- raw ,
425- preprocessorWorkerController ! ,
426- urlResolver ,
427- )
428- if ( modules ) {
429- moduleCache . set ( id , modules )
430- }
431-
432- if ( deps ) {
433- for ( const file of deps ) {
434- this . addWatchFile ( file )
436+ return {
437+ code : css ,
438+ map,
435439 }
436- }
437-
438- return {
439- code : css ,
440- map,
441- }
440+ } ,
442441 } ,
443442 }
444-
445- // for backward compat, make `plugin.transform` a function
446- // but still keep the `handler` property
447- // so that we can use `filter` property in the future
448- plugin . transform = transformHook . handler
449- ; ( plugin . transform as any ) . handler = transformHook . handler
450-
451- return plugin
452443}
453444
454445/**
@@ -508,7 +499,7 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
508499 return cssBundleName
509500 }
510501
511- const plugin = {
502+ return {
512503 name : 'vite:css-post' ,
513504
514505 renderStart ( ) {
@@ -1076,14 +1067,7 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
10761067 }
10771068 }
10781069 } ,
1079- } satisfies Plugin
1080-
1081- // backward compat
1082- const handler = plugin . transform . handler
1083- ; ( plugin as any ) . transform = handler
1084- ; ( plugin as any ) . transform . handler = handler
1085-
1086- return plugin
1070+ }
10871071}
10881072
10891073export function cssAnalysisPlugin ( config : ResolvedConfig ) : Plugin {
0 commit comments