gohugoio/hugo · error

unsupported jsx type: %q

Error message

unsupported jsx type: %q

What it means

Hugo translates the `JSX` option into esbuild's JSX mode. Accepted values are "" or "transform" (classic React.createElement transform), "preserve" (leave JSX untouched), and "automatic" (React 17+ automatic runtime). Anything else fails option compilation with this error.

Source

Thrown at internal/js/esbuild/options.go:367

	case "esm":
		format = api.FormatESModule
	case "cjs":
		format = api.FormatCommonJS
	default:
		err = fmt.Errorf("unsupported script output format: %q", opts.Format)
		return
	}

	var jsx api.JSX
	switch opts.JSX {
	case "", "transform":
		jsx = api.JSXTransform
	case "preserve":
		jsx = api.JSXPreserve
	case "automatic":
		jsx = api.JSXAutomatic
	default:
		err = fmt.Errorf("unsupported jsx type: %q", opts.JSX)
		return
	}

	var platform api.Platform
	switch opts.Platform {
	case "", "browser":
		platform = api.PlatformBrowser
	case "node":
		platform = api.PlatformNode
	case "neutral":
		platform = api.PlatformNeutral
	default:
		err = fmt.Errorf("unsupported platform type: %q", opts.Platform)
		return
	}

	var defines map[string]string
	if opts.Defines != nil {

View on GitHub ↗ (pinned to 8a468df065)

Solutions

  1. Set JSX to "transform", "preserve", or "automatic" — "react-jsx" in tsconfig maps to "automatic" here.
  2. If using the automatic runtime, also set `JSXImportSource` (e.g. "preact") as needed.
  3. Drop the option to use the default classic transform.

Example fix

{{/* before */}}
{{ $js := resources.Get "app.jsx" | js.Build (dict "JSX" "react-jsx") }}
{{/* after */}}
{{ $js := resources.Get "app.jsx" | js.Build (dict "JSX" "automatic") }}
Defensive patterns

Strategy: validation

Validate before calling

validJSX := map[string]bool{"transform": true, "preserve": true, "automatic": true}
if opts.JSX != "" && !validJSX[opts.JSX] {
    return fmt.Errorf("invalid jsx option %q; must be transform, preserve, or automatic", opts.JSX)
}

Prevention

When it happens

Trigger: Passing `dict "JSX" "react-jsx"` (a tsconfig-style value) or any other unrecognized string to js.Build/js.Batch when building .jsx/.tsx files.

Common situations: Copying `jsx: "react-jsx"` or "react" from tsconfig.json instead of using esbuild's terms; typos like "auto" instead of "automatic"; migrating from a bundler with different JSX mode names.

Related errors


AI-assisted analysis of gohugoio/hugo@8a468df065 (2026-07-31). Data as JSON: /data/errors/035bc5eb8d062d3d.json. Report an issue: GitHub ↗.