Skip to content

fix: strip import attributes from dynamic imports in dev mode#22023

Open
teee32 wants to merge 1 commit intovitejs:mainfrom
teee32:fix/strip-dynamic-import-attributes
Open

fix: strip import attributes from dynamic imports in dev mode#22023
teee32 wants to merge 1 commit intovitejs:mainfrom
teee32:fix/strip-dynamic-import-attributes

Conversation

@teee32
Copy link
Copy Markdown

@teee32 teee32 commented Mar 25, 2026

Description

Dynamic imports with import attributes (e.g. import('./data.json', { with: { type: 'json' } })) cause runtime errors in dev mode:

  • Firefox: SyntaxError: missing ) after argument list — Firefox does not yet support import attributes syntax
  • Chrome: Failed to load module script: Expected a JSON module script but the server responded with a MIME type of "text/javascript"

Vite already strips import attributes from static imports during dev (since it processes typed imports internally), but dynamic imports were explicitly excluded by the !isDynamicImport guard at importAnalysis.ts:523. This PR extends the attribute stripping to also cover dynamic imports, adjusting the removal range for the parenthesized syntax.

Fixes #19095

Alternatives considered

  • Serving JSON files with application/json MIME type when import attributes are present — this would fix Chrome but not Firefox, and would conflict with Vite's JSON-to-JS transform pipeline.
  • Handling this in the build pipeline — not needed since Rolldown/Rollup already handles import attributes during build. The issue is dev-only.

Reviewer notes

The core change is small (one condition change + one new branch in importAnalysis.ts). The key insight is that for dynamic imports, import attributes are the second argument inside import(specifier, options), so the removal range is [end, expEnd - 1) (after specifier, before closing paren), vs [end + 1, expEnd) for static imports.


  • Read the Contributing Guidelines
  • Checked that there isn't already a PR that solves the problem the same way
  • No documentation update needed (dev server internal behavior)
  • Included a regression test (dynamic import with import attributes in JSON playground, serve-only)

Import attributes (e.g. `{ with: { type: 'json' } }`) were already
stripped from static imports during dev, but dynamic imports were
explicitly excluded. This caused:

- Firefox: SyntaxError (import attributes not yet supported)
- Chrome: MIME type mismatch (expects application/json due to type assertion,
  but Vite serves transformed JS)

Extend the existing attribute stripping to also cover dynamic imports,
adjusting the removal range for the different syntax structure (second
argument inside parentheses vs trailing clause on static import).

Closes vitejs#19095

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Dynamic import with type: 'json' causes syntax error on Firefox

1 participant