compileLightningCSS() — vite Function Reference

Source Code

packages/vite/src/node/plugins/css.ts lines 3184–3386

async function compileLightningCSS(
  environment: PartialEnvironment,
  id: string,
  src: string,
  deps: Set<string>,
  workerController: PreprocessorWorkerController,
  urlResolver?: CssUrlResolver,
): Promise<{
  code: string
  map?: string | undefined
  modules?: Record<string, string>
}> {
  const { config } = environment
  // replace null byte as lightningcss treats that as a string terminator
  // https://github.com/parcel-bundler/lightningcss/issues/874
  const filename = removeDirectQuery(id).replace('\0', NULL_BYTE_PLACEHOLDER)

  let res: LightningCssTransformAttributeResult | LightningCssTransformResult
  try {
    res = styleAttrRE.test(id)
      ? (await importLightningCSS()).transformStyleAttribute({
          filename,
          code: Buffer.from(src),
          targets: config.css.lightningcss?.targets,
          minify: config.isProduction && !!config.build.cssMinify,
          analyzeDependencies: true,
        })
      : await (
          await importLightningCSS()
        ).bundleAsync({
          ...config.css.lightningcss,
          filename,
          // projectRoot is needed to get stable hash when using CSS modules
          projectRoot: config.root,
          resolver: {
            async read(filePath) {
              if (filePath === filename) {
                return src
              }

              const code = fs.readFileSync(filePath, 'utf-8')
              const lang = CSS_LANGS_RE.exec(filePath)?.[1] as
                | CssLang
                | undefined
              if (isPreProcessor(lang)) {
                const result = await compileCSSPreprocessors(
                  environment,
                  id,
                  lang,
                  code,
                  workerController,
                )
                result.deps?.forEach((dep) => deps.add(dep))
                // TODO: support source map
                return result.code
              } else if (lang === 'sss') {
                const sssResult = await transformSugarSS(environment, id, code)
                // TODO: support source map
                return sssResult.code
              }
              return code
            },
            async resolve(id, from) {
              const publicFile = checkPublicFile(
                id,
                environment.getTopLevelConfig(),
              )
              if (publicFile) {
                return publicFile
              }

              // NOTE: with `transformer: 'postcss'`, CSS modules `composes` tried to resolve with
              //       all resolvers, but in `transformer: 'lightningcss'`, only the one for the
              //       current file type is used.
              const atImportResolvers = getAtImportResolvers(
                environment.getTopLevelConfig(),
              )
              const lang = CSS_LANGS_RE.exec(from)?.[1] as CssLang | undefined
              let resolver: ResolveIdFn
              switch (lang) {
                case 'css':