vite-preset.ts

import {terser} from 'rollup-plugin-terser';
import {UserConfig} from 'vite';
import fs from 'fs';
import litStylesLoader from '../configs/lit-styles.js';

export interface VitePresetOptions {
  scssIncludePaths: string[];
}

function toScssPath(path) {
  return path.replace('.lit.scss.js', '.lit.scss');
}

function litStylesPlugin(paths: string[]) {
  return {
    enforce: 'pre' as const,
    name: 'lit:css',
    // Rename the module ID for `.lit.scss` files to `.lit.scss.js` to prevent
    // Astro from treating them as CSS.
    async resolveId(id, importer, options) {
      if (id.split('?')[0].endsWith('.lit.scss')) {
        const resolution = await this.resolve(id, importer, {
          skipSelf: true,
          ...options,
        });
        return resolution.id.replace('.lit.scss', '.lit.scss.js');
      }
    },
    // Load the `.lit.scss.js` files from the filesystem using their original
    // `.lit.scss` paths.
    async load(id) {
      const base = id.split('?')[0];
      if (base.endsWith('.lit.scss.js')) {
        const filename = await this.resolve(toScssPath(base));
        return fs.readFileSync(toScssPath(filename.id), 'utf-8');
      }
    },
    // Transform the sources into Lit JS by sending it through the
    // `litStylesLoader`.
    transform(src, id) {
      if (id.split('?')[0].endsWith('.lit.scss.js')) {
        const code = litStylesLoader(src, paths);
        return {
          code: code,
          map: null,
        };
      }
      return undefined;
    },
  };
}