FG
๐Ÿ’ป Software๐ŸŒ Web & Full-Stack

Fails to load config with `Excepted identifier but found "import"` error

Fresh3 days ago
Mar 14, 20260 views
Confidence Score95%
95%

Problem

Note: vite@6.0.5 is out pinning to esbuild 0.24.0 until @sapphi-red's PR to esbuild is merged and released, you can update to latest vite to fix this issue. Leaving this issue open as we'll revert the temporary fix soon. Workaround and the cause It seems a change in esbuild 0.24.1 is affecting Vite's config loader: https://github.com/evanw/esbuild/issues/4010 The current workaround is to set overrides in package managers: - pnpm overrides [code block] - npm overrides [code block] - yarn resolutions [code block] Edited by @sapphi-red --- Describe the bug <img width="750" alt="Screenshot 0006-12-20 at 14 20 15" src="https://github.com/user-attachments/assets/cf41b16a-67a3-4f1d-977c-ba7aab3e02aa" /> Reproduction pnpm create vite@latest; babel-react Steps to reproduce _No response_ System Info [code block] Used Package Manager pnpm Logs _No response_ Validations - [X] Follow our Code of Conduct - [X] Read the Contributing Guidelines. - [X] Read the docs. - [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate. - [X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead. - [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server. - [X] The provided reproduction is a minimal reproducible example of the bug.

Unverified for your environment

Select your OS to check compatibility.

2 Fixes

Canonical Fix
Unverified Fix
New Fix โ€“ Awaiting Verification

Update Vite and Configure Package Manager Overrides

Medium Risk

The error 'Expected identifier but found "import"' occurs due to a breaking change in esbuild version 0.24.1, which affects Vite's configuration loading mechanism. This issue arises when Vite is pinned to an incompatible version of esbuild, leading to syntax errors in the configuration files.

Awaiting Verification

Be the first to verify this fix

  1. 1

    Update Vite to Latest Version

    Upgrade Vite to the latest version to ensure compatibility with the latest esbuild. This should resolve the configuration loading issue.

    bash
    pnpm update vite
  2. 2

    Set Package Manager Overrides for esbuild

    If you cannot update Vite immediately, set an override for esbuild in your package manager to revert to a compatible version (0.24.0). This will prevent the syntax error from occurring.

    bash
    pnpm add esbuild@0.24.0 --save-exact
  3. 3

    Configure pnpm Overrides

    Add an override in your pnpm configuration to ensure that esbuild uses the compatible version across your project.

    bash
    echo '{ "overrides": { "esbuild": "0.24.0" } }' > pnpm-lock.yaml
  4. 4

    Verify Configuration

    After applying the updates and overrides, run your Vite project to ensure that the configuration loads without errors. Check for the absence of the 'Expected identifier but found "import"' error.

    bash
    pnpm run dev

Validation

To confirm the fix worked, ensure that your Vite project starts without any configuration errors and that the application runs as expected. Look for the absence of the specific error message in the console.

Sign in to verify this fix

1 low-confidence fix
Unverified Fix
New Fix โ€“ Awaiting Verification

Update Vite and Configure Package Manager Overrides

Medium Risk

The error 'Expected identifier but found "import"' occurs due to a breaking change in esbuild version 0.24.1, which affects how Vite loads configuration files. This issue is resolved in Vite version 6.0.6 and later, which is compatible with the updated esbuild. The workaround involves setting package manager overrides to force the use of a specific esbuild version that is compatible with Vite.

Awaiting Verification

Be the first to verify this fix

  1. 1

    Update Vite to Latest Version

    Upgrade Vite to the latest version to ensure compatibility with esbuild. This can be done using your package manager.

    bash
    pnpm add vite@latest
  2. 2

    Set Package Manager Overrides for esbuild

    If you are using pnpm, set the overrides in your package.json to ensure that the correct version of esbuild is used. This will prevent conflicts with the Vite configuration loader.

    json
    { "pnpm": { "overrides": { "esbuild": "0.24.0" } } }
  3. 3

    For npm Users: Configure npm Overrides

    If you are using npm, add the following overrides to your package.json to pin esbuild to a compatible version.

    json
    { "overrides": { "esbuild": "0.24.0" } }
  4. 4

    For yarn Users: Set Yarn Resolutions

    If you are using yarn, add the following resolutions to your package.json to ensure that the correct version of esbuild is used.

    json
    { "resolutions": { "esbuild": "0.24.0" } }
  5. 5

    Test the Configuration

    Run your Vite project to confirm that the configuration loads correctly without errors. If the issue persists, double-check the package manager settings and ensure that the correct versions are installed.

    bash
    pnpm run dev

Validation

To confirm the fix worked, ensure that the Vite project starts without throwing the 'Expected identifier but found "import"' error. Check the console output for any errors during the build process.

Sign in to verify this fix

Environment

Submitted by

AC

Alex Chen

2450 rep

Tags

vitebuild-tooljavascriptbug:-upstreamp5-urgent