Using with fontsource

[openscript]

Thank you for your work on finding a solution for this!

I'm trying to externalize fonts I import from fontsource.org packges such as:

import "@fontsource-variable/eczar";
import "@fontsource-variable/raleway";

I have the following vite.config.ts:

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import dts from "vite-plugin-dts";
import svgr from "vite-plugin-svgr";
import libAssetsPlugin from "@laynezh/vite-plugin-lib-assets";
import packageJson from "./package.json";

export default defineConfig({
  build: {
    ssr: true,
    target: "esnext",
    lib: {
      entry: "src/index.ts",
      name: packageJson.name,
      formats: ["es"],
    },
    rollupOptions: {
      external: ["react", "react-dom"],
      output: {
        globals: {
          react: "React",
          "react-dom": "ReactDOM",
          "react/jsx-runtime": "jsxRuntime",
        },
      },
    },
  },
  plugins: [
    dts({
      entryRoot: "src",
    }),
    react(),
    svgr({ svgrOptions: { ref: true }, include: "**/*.svg?react" }),
    libAssetsPlugin({ limit: 1024 * 16 }),
  ],
});

Unfortunately the fonts are still rendered into the css file as base64. Any idea what I'm doing wrong?

[coder-layne]

@openscript Thank you for your feedback, the plugin does not handle CSS files from npm packages currently, which is causing the issue you encountered.

[coder-layne]

@openscript I just released v0.5.22, hoping that will resolve the issue you encountered.

[openscript]

@coder-layne thank you so much for quickly fixing this. It works! Unfortunately Vite doesn't copy the font files to the assets folder. Do you have an idea how to make Vite copy the font files?

[coder-layne]

@openscript In the playground folder, current scene has been added, and the font files can be extracted and emitted to the assets directory as usual. You can refer to the configuration in it.

[openscript]

@coder-layne Of course I've looked at the playground and tried out many things, but I just cannot figure out why vite-plugin-lib-assets isn't outputting anything.

My vite.config.ts looks like this: https://github.com/timelet/timelet/blob/try/external-fonts/packages/ui/vite.config.ts

[coder-layne]

@openscript I'm not sure what your intention was in adding the build.srr option in the configuration, but everything works fine after removing it.

[openscript]

Thank you so much @coder-layne! Just this minute I've also seen this commit: https://github.com/vitejs/vite/commit/ef8c9b9

Likely this relates too.

[coder-layne]

@openscript Great! The commit you mentioned also cleared up my confusion.

[coder-layne]

Due to #81 caused by fontsource support in version 0.5.22, a rollback has been made. This issue has been reopened to track progress.