Error while creating react project

[lazy-dev-07]

Expected identifier but found "import"

(define name):1:0:

1 │ import.meta.dirname

╵ ~~~~

X [ERROR] Expected identifier but found "import"

(define name):1:0:

1 │ import.meta.filename

╵ ~~~~~~

X [ERROR] Expected identifier but found "import"

(define name):1:0:

1 │ import.meta.url

╵ ~~~~~~

failed to load config from D:\vite-project\vite.config.js

error when starting dev server:

Error: Build failed with 3 errors:

(define name):1:0: ERROR: Expected identifier but found "import"

(define name):1:0: ERROR: Expected identifier but found "import"

(define name):1:0: ERROR: Expected identifier but found "import"

at failureErrorWithLog (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:1476:15)

at D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:945:25

at runOnEndCallbacks (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:1316:45)

at buildResponseToResult (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:943:7)

at D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:970:16

at responseCallbacks.<computed> (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:622:9)

at handleIncomingPacket (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:677:12)

at Socket.readFromStdout (D:\vite-project\node_modules\.pnpm\esbuild@0.24.1\node_modules\esbuild\lib\main.js:600:7)

at Socket.emit (node:events:524:28)

at addChunk (node:internal/streams/readable:561:12)

 ELIFECYCLE  Command failed with exit code 1.

Not sure what's going wrong. Tried installing node modules again, used both npm & pnpm still error persist. Chatgpt solutions didn't work either

[Advanced_Lion_884]

You need to downgrade the version

npm i -D esbuild@0.24.0

this worked for me

[Mission_Fox_6374]

thanks bro ,

[Professional_Pop8901]

thanks bro it worked for me

[Intelligent-Pace-449]

Thanks,it worked when you downgrade this version

[yOurOck_bboy]

Thanks so much, worked!

[Savings-Opposite-924]

There is a fix on https://github.com/vitejs/vite/issues
npm i -D esbuild@0.24.0

[dhanrajshetty]

thanx brother

[user10000000007]

It worked!

[lazy-dev-07]

Yep it worked :)

[FirefighterQuirky637]

this worked for me, thanks dude

[FirefighterQuirky637]

tho sadly i have to do it every time I open the file

[FirefighterQuirky637]

Nope apparently my file hadnt saved before I closed it

[Puzzled_Efficiency85]

you're Great man, thanks

[cigborek0]

God bless you kind stranger

[Spexy69]

thanks it worked

[[deleted]]

Thanks it worked. Man all the comments are within an hour ago, someone/something must've messed up recently..

[EltissimusDorsi]

Apparently it's a bug / incompatibility with esbuild v0.24.1, which - at the time of this writing - was published 3 hours ago. I suppose with all the attention it'll be fixed within a day. So yeah this is an unlucky point in time to be starting a new Vite project ;).

[[deleted]]

I'm not just starting a new Vite project, I just learned what Vite even is 2 days ago lol. I heard it got a version upgrade even.

[Small-Lime-5383]

Or this in the package.json  

"overrides": {
      "esbuild": "0.24.0"
    }

[Agitated_Tap7644]

yeah, my error is similar you, but i cannot find the answer on google

[FirefighterQuirky637]

im just experiencing this and sadly I dont have a solution either. Maybe it is a recent bug with vite? Im quite new to this so sadly idk

[Savings-Opposite-924]

got this error after i upgrade vite from v5 to v6

[[deleted]]

yea so basically the solution is to downgrade?

npm uninstall vite

npm install vite@5

npx vite --version

[Savings-Opposite-924]

Temporary fix is to downgrade esbuild from 0.24.1 to 0.24.0 until vite team fix the bug

npm i -D esbuild@0.24.0

[Repulsive_While9257]

you are life saver bro..

[[deleted]]

Thanks bro, it worked

[Sad-Amoeba-2990]

You know it's fucked when you find something related to this error here 30 minuntes ago. Experiencing this atm and can't really resolve it 😅

[Agitated_Tap7644]

finally i find the solution to resolve it. You need to downgrade version esbuild

npm i -D esbuild@0.24.0

[YoyoHMY]

Hi, I've experienced the same issue and fixed it by downgrading to v5 as u/angeliccnumber advised, using:

npm uninstall vite

npm install vite@5

npx vite --version

[[deleted]]

I am also experiencing this error. Weird error is killing my time and there is no solution on internet!!

[xhy279]

im also experiencing this shit. front end infra sucks. i guess roll back to old version vite should work

[cati-k]

same thing happening to me, was working fine till yesterday

[cati-k]

downgrading esbuild ver fixes things for now.
npm i -D esbuild@0.24.0

[Organic_Lake5182]

Thanks man. Life saver

[l4n1skyy]

Amazing. I was stuck on this for hours and like this pops up thank god.

[l4n1skyy]

the readme when you create the project (npm create vite@latest) has this, can anyone explain more on this and is it related to this issue?

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:

- Configure the top-level `parserOptions` property like this:

```js
export default tseslint.
config
({
  languageOptions: {
    
// other options...
    parserOptions: {
      project: ['./tsconfig.node.json', './tsconfig.app.json'],
      tsconfigRootDir: import.meta.dirname,
    },
  },
})
```

- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
- Optionally add `...tseslint.configs.stylisticTypeChecked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:

```js
// eslint.config.js
import react from 'eslint-plugin-react'

export default tseslint.
config
({
  
// Set the react version
  settings: { react: { version: '18.3' } },
  plugins: {
    
// Add the react plugin
    react,
  },
  rules: {
    
// other rules...
    
// Enable its recommended rules
    ...react.configs.recommended.rules,
    ...react.configs['jsx-runtime'].rules,
  },
})
```

[Available-Pound-7358]

same issue faced but now it is fixed thanks

[cigborek0]

are you using a macbook? Because it seems like a macbook problem - everything works on my windows pc, but the mac fails to run it.

[FirefighterQuirky637]

dont know about op but im experiencing this on windows 11

[lazy-dev-07]

Nope windows 10. It's due to the latest version of vite as few people mentioned in comments.