Issue: This module doesn't have an associated type. Use a known file extension, or register a loader for it.

[rohitshrestha-nordra]

Summary

I am getting this issue with loading ttf files from a dependency I installed.

` ⨯ ./node_modules/.pnpm/[email protected]/node_modules/patchright-core/lib/vite/recorder/assets/codicon-DCmgc-ay.ttf.ttf
Unknown module type
This module doesn't have an associated type. Use a known file extension, or register a loader for it.

Read more: https://nextjs.org/docs/app/api-reference/next-config-js/turbo#webpack-loaders

./node_modules/.pnpm/[email protected]/node_modules/patchright-core/lib/vite/recorder/index.html.html
Unknown module type
This module doesn't have an associated type. Use a known file extension, or register a loader for it.

Read more: https://nextjs.org/docs/app/api-reference/next-config-js/turbo#webpack-loaders`

I tried adding rules in config but it didn't work.

import path from "node:path";
import withBundleAnalyzer from "@next/bundle-analyzer";
import type { NextConfig } from "next";

export const config: NextConfig = {
  images: {
    formats: ["image/avif", "image/webp"],
    remotePatterns: [
      {
        protocol: "https",
        hostname: "img.clerk.com",
      },
    ],
  },
  turbopack: {
    root: path.resolve(__dirname, "../../"),
    resolveExtensions: [
      ".mdx",
      ".tsx",
      ".ts",
      ".jsx",
      ".js",
      ".mjs",
      ".json",
      ".ttf",
    ],
    rules: {
      "*.ttf": {
        loaders: ["loader-runner"],
        as: "*.ttf",
      },
      "*.html": {
        loaders: ["loader-runner"],
        as: "*.html",
      },
    },
  },

  // biome-ignore lint/suspicious/useAwait: rewrites is async
  async rewrites() {
    return [
      {
        source: "/ingest/static/:path*",
        destination: "https://us-assets.i.posthog.com/static/:path*",
      },
      {
        source: "/ingest/:path*",
        destination: "https://us.i.posthog.com/:path*",
      },
      {
        source: "/ingest/decide",
        destination: "https://us.i.posthog.com/decide",
      },
    ];
  },

  // This is required to support PostHog trailing slash API requests
  skipTrailingSlashRedirect: true,
  reactStrictMode: false,
};

export const withAnalyzer = (sourceConfig: NextConfig): NextConfig =>
  withBundleAnalyzer()(sourceConfig);

Additional information

No response

Example

No response

[lewiii254]

This error happens because Turbopack doesn't automatically know how to load .ttf or .html files coming from dependencies, and the rules you added aren’t actually valid Turbopack loaders. Turbopack does not support arbitrary webpack loaders like loader-runner.

Fix: Tell Turbopack to treat these file types as static assets

Turbopack supports as: "asset" and "text" for unknown file extensions — not custom loaders.

Add this inside turbopack:

turbopack: {
  rules: {
    "*.ttf": {
      as: "asset",
    },
    "*.html": {
      as: "text",
    },
  },
},

Why this works

• .ttf → served as a static asset file
• .html → imported as raw text (Turbopack cannot hydrate HTML imports anyway)

❗Important

Don’t use extensions like .ttf.ttf or .html.html — those are coming from the dependency. The rule matches the final extension, so "*.ttf" works.

If the package truly needs to import HTML as templates

You can also disable Turbopack for that particular dependency and fall back to Webpack:

experimental: {
  turbo: {
    resolveAlias: {
      "patchright-core": false,
    },
  },
}

…but try the simple asset/text rules first — that solves the issue in most cases.