Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Includes an excessive amount of font files when using tailwind #443

Open
cadamsdev opened this issue Jan 1, 2025 · 3 comments
Open

Includes an excessive amount of font files when using tailwind #443

cadamsdev opened this issue Jan 1, 2025 · 3 comments

Comments

@cadamsdev
Copy link

cadamsdev commented Jan 1, 2025 •
edited
Loading

Problem

When using nuxt/fonts with the tailwind module, I'm seeing nuxt/fonts adding an excessive amount of font-faces to the global stylesheet. It's also downloading 32 font files when I'm only using 1 font and 1 font weight "400". It's downloading a font file for each font-weight, variable font, italicized versions and woff format.

Expected

  • Should only download the font files which are being used
  • Should only include the font-faces which are being used
  • Should only use WOFF2 format by default. If someone needs WOFF fallback they can opt into that.

Actual

  • Downloads all font weights, variants etc
  • Adds font-faces which are not being used
  • Includes WOFF fonts

Steps to reproduce

  1. Install nuxt/fonts module
npx nuxi module add fonts
  1. Install the tailwind module
npx nuxi@latest module add tailwindcss
  1. Add tailwind config to nuxt.config.ts
  tailwindcss: {
    config: {
      theme: {
        extend: {
          fontFamily: {
            inter: ['Inter'],
          },
        },
      },
    },
  },
  1. Use the new font using tailwind e.g in app.vue
<template>
  <div>
    <NuxtRouteAnnouncer />
    <div class="font-inter">Inter</div>
  </div>
</template>
  1. Run npm run generate

You can see its downloading 32 font files.

Prerendered 4 routes in 0.362 seconds                                                                                           nitro 12:37:47 PM
ℹ Downloading fonts...                                                                                                      @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L0UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L9UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L1UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L6UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L2UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L3UUMbndwVgHU.woff2                             @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L5UUMbndwV.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2                                @nuxt/fonts 12:37:47 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2                                  @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dphjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdthjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTch9thjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dthjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc69thjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcB9xhjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcPtxhjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdxhjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTccNxhjg.woff                       @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyeMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyfMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuOKfMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyYMZs.woff                          @nuxt/fonts 12:37:48 PM
  ├─ https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuBWYMZs.woff                          @nuxt/fonts 12:37:49 PM
✔ Fonts downloaded and cached.
  1. Look in the dist/index.html you can see it's adding more font-faces than we need.
    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L0UUMbndwVgHU-65EHupo1eE.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: "Inter Fallback: Arial";
      src: local("Arial");
      size-adjust: 107.0596%;
      ascent-override: 90.4869%;
      descent-override: 22.5554%;
      line-gap-override: 0%
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L9UUMbndwVgHU-NhITM010QG.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L1UUMbndwVgHU-qH7ATOX08m.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+1F00-1FFF;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L6UUMbndwVgHU-QGpAKkWaRW.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L2UUMbndwVgHU-dUAjfz9vRP.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L3UUMbndwVgHU-AqFQoE4dmC.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable Italic"), url(/_fonts/UcC53FwrK3iLTcvneQg7Ca725JhhKnNqk6L5UUMbndwV-pgdKO9ZKgu.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
      font-weight: 100 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU-KVPO7qQakV.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU-dhQPbMoiPv.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU-F30FOQT0Pw.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+1F00-1FFF;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU-sGaaRn4DAV.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU-lsYHSK6K6k.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU-RqiMbhqjR3.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Variable"), url(/_fonts/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw-D8rjOS3fnY.woff2) format(woff2);
      font-display: swap;
      unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
      font-weight: 100 900;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Thin Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dphjg-yc9Sc53FFE.woff) format(woff);
      font-display: swap;
      font-weight: 100;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter ExtraLight Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdthjg-uKvhBPXFuv.woff) format(woff);
      font-display: swap;
      font-weight: 200;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Light Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTch9thjg-uRdt8wXlMN.woff) format(woff);
      font-display: swap;
      font-weight: 300;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Regular Italic"), local("Inter Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dthjg-Cghfr3Mro7.woff) format(woff);
      font-display: swap;
      font-weight: 400;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Medium Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc69thjg-9Gz4DM1G4W.woff) format(woff);
      font-display: swap;
      font-weight: 500;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter SemiBold Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcB9xhjg-io7FNUyPjT.woff) format(woff);
      font-display: swap;
      font-weight: 600;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Bold Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcPtxhjg-IvzPBD7f1q.woff) format(woff);
      font-display: swap;
      font-weight: 700;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter ExtraBold Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdxhjg-ZlaHUsm4JN.woff) format(woff);
      font-display: swap;
      font-weight: 800;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Black Italic"), url(/_fonts/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTccNxhjg-11AqZvIeQZ.woff) format(woff);
      font-display: swap;
      font-weight: 900;
      font-style: italic
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Thin"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyeMZs-oMIw0BKr1g.woff) format(woff);
      font-display: swap;
      font-weight: 100;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter ExtraLight"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyfMZs-mesapiiH4F.woff) format(woff);
      font-display: swap;
      font-weight: 200;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Light"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuOKfMZs-ppaBBMhPkF.woff) format(woff);
      font-display: swap;
      font-weight: 300;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Regular"), local("Inter"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfMZs-1nnSLxpIaT.woff) format(woff);
      font-display: swap;
      font-weight: 400;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Medium"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZs-eCVSWtm5ex.woff) format(woff);
      font-display: swap;
      font-weight: 500;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter SemiBold"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZs-hqV6ZTaH7p.woff) format(woff);
      font-display: swap;
      font-weight: 600;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Bold"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYMZs-6xY2YA4tKL.woff) format(woff);
      font-display: swap;
      font-weight: 700;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter ExtraBold"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyYMZs-GhuC9bNp0d.woff) format(woff);
      font-display: swap;
      font-weight: 800;
      font-style: normal
    }

    @font-face {
      font-family: Inter;
      src: local("Inter Black"), url(/_fonts/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuBWYMZs-uM0pOraRMj.woff) format(woff);
      font-display: swap;
      font-weight: 900;
      font-style: normal
    }

Minimum reproduction

https://github.com/cadamsdev/nuxt-fonts-tailwind-issue
@laspinacristian
Copy link

I too noticed this strange behaviour.
Didn't excepted it was related to the use of tailwind nuxt module, could it be a issue of that module?

@laspinacristian
Copy link

laspinacristian commented Jan 14, 2025 •
edited
Loading

I made a quick test and initialized a fresh started nuxt with project with only the fonts module installed.
I just made a css file and include this file in nuxt.config.ts no tailwind module installed

~/assets/main.css

body {
  font-family: "Inter";
}

~/nuxt.config.ts

export default defineNuxtConfig({
  compatibilityDate: "2024-11-01",
  devtools: { enabled: false },
  modules: ["@nuxt/fonts"],
  css: ["~/assets/main.css"],
});

The output is the same described by @cadamsdev
Indeed the problem is that font rendering is different between the font face made up from this module and the one used straight from google fonts imported using <link> tag on plain html.

Here's a sample screenshot (left Nuxt Fonts, right Google Fonts)

Image

@cadamsdev cadamsdev changed the title Issues when used with tailwind Includes an excessive amount of font files when using tailwind Jan 15, 2025
@MickL
Copy link

MickL commented Jan 29, 2025 •
edited
Loading

Unfortunately I have the same issue:

main.css:

@import "tailwindcss";

@theme {
    --font-sans: 'Inter', sans-serif;
    --font-serif: 'Merriweather', sans-serif;
}

Even tho I tried to regulate what fonts should be included:

families: [
   { name: 'Merriweather', weights: [400] },
   { name: 'Inter', weights: [400, 500] },
],

The output is enormous:
Image

@MickL MickL mentioned this issue Jan 29, 2025
Open
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@MickL @cadamsdev @laspinacristian