remix-run/remix · error · AssetServerCompilationError

FILE_TRANSFORM_NOT_SUPPORTED

FILE_TRANSFORM_NOT_SUPPORTED

Error message

File transform "${requestTransform.name}" does not support ${currentExtension} inputs for ${filePath}

What it means

A requested transform exists, but its declared supported input extensions don't include the current file's extension, so the compiler throws FILE_TRANSFORM_NOT_SUPPORTED. After each transform the current extension may change, so later transforms are validated against the intermediate extension.

Source

Thrown at packages/assets/src/lib/files/compiler.ts:380

    filePath: string,
    source: EmittedFile,
    transforms: readonly ParsedRequestTransform[],
  ): Promise<{ body: Uint8Array; extension: string } | null> {
    let currentBody = source.body
    let currentExtension = source.extension
    let appliedTransform = false

    for (let requestTransform of transforms) {
      let transform = resolvedOptions.transforms.get(requestTransform.name)
      if (transform === undefined) {
        throw createAssetServerCompilationError(
          `Unknown file transform "${requestTransform.name}" requested for ${filePath}`,
          { code: 'FILE_TRANSFORM_QUERY_INVALID' },
        )
      }

      if (!supportsTransformExtension(transform.extensions, currentExtension)) {
        throw createAssetServerCompilationError(
          `File transform "${requestTransform.name}" does not support ${currentExtension} inputs for ${filePath}`,
          { code: 'FILE_TRANSFORM_NOT_SUPPORTED' },
        )
      }

      let result: unknown
      let transformSubject: FileTransformSubject = {
        kind: 'request',
        name: requestTransform.name,
      }
      try {
        result = await transform.transform(currentBody, {
          extension: currentExtension,
          filePath,
          param: requestTransform.param,
        })
      } catch (error) {
        throw toFileTransformFailedError(error, filePath, transformSubject)

View on GitHub (pinned to 9696913134)

Solutions

  1. Match transform names to the actual source extension of the file
  2. Reorder or trim transform chains so each transform's input extension matches the file at that stage
  3. Rename the file to the extension the transform expects (e.g. .scss)

Example fix

// before
href="/styles.css?transform=sass"
// after
href="/styles.scss?transform=sass"
Defensive patterns

Strategy: validation

Validate before calling

const supported = transformExtensions.has(currentExtension)
if (!supported) useDifferentTransformOrFile()

Type guard

const extensionSupported = (ext: string, supported: readonly string[]) => supported.includes(ext)

Try / catch

try { applyTransforms(file, transforms) } catch (e) { if (e.code === 'FILE_TRANSFORM_NOT_SUPPORTED') retryWithoutTransform() else throw e }

Prevention

When it happens

Trigger: Applying e.g. a sass transform to a .css file, or chaining transforms where the first changes the extension to one the next transform doesn't accept (e.g. ts→js followed by a ts-only transform).

Common situations: Mismatched transform chains in config; applying a preprocessor transform to already-compiled output; changing a file's extension without updating transform config.

Related errors


AI-assisted analysis of remix-run/remix@9696913134 (2026-08-27). Data as JSON: /api/errors/0e3f5f3c4a97ee3b. Report an issue: GitHub.