# React Typescript Project... Issues with chakra UI

**URL:** <https://forum.codewithmosh.com/t/react-typescript-project-issues-with-chakra-ui/21466>\
**Category:** React\
**Created:** [July 12, 2023, 7:29pm UTC](https://forum.codewithmosh.com/t/react-typescript-project-issues-with-chakra-ui/21466 "2023-07-12T19:29:08Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![kibbkibb](https://avatars.discourse-cdn.com/v4/letter/k/a9a28c/32.png) [@kibbkibb](https://forum.codewithmosh.com/u/kibbkibb)\
**Post date:** [July 12, 2023, 7:29pm UTC](https://forum.codewithmosh.com/t/react-typescript-project-issues-with-chakra-ui/21466/1 "2023-07-12T19:29:08Z")

</div>

X [ERROR] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle]

```
node_modules/esbuild/lib/main.js:1363:21:
  1363 │ let result = await callback({
       ╵ ^

at packageEntryFailure (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28691:11)
at resolvePackageEntry (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28688:5)
at tryNodeResolve (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28422:20)
at Context.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28183:28)
at Object.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:44123:64)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:65713:21
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39872:34
at async requestCallbacks.on-resolve (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1363:22)
at async handleRequest (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:726:13)      

```

This error came from the “onResolve” callback registered here:

```
node_modules/esbuild/lib/main.js:1282:20:
  1282 │ let promise = setup({
       ╵ ^

at setup (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39852:19)
at handlePlugins (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1282:21)
at buildOrContextImpl (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:971:5)        
at Object.buildOrContext (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:779:5)     
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:68
at new Promise (<anonymous>)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:27)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2015:58)
at prepareEsbuildOptimizerRun (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:45866:35)

```

The plugin “vite:dep-pre-bundle” was triggered by this import

```
../node_modules/@chakra-ui/react/dist/index.mjs:54:14:
  54 │ export * from "@chakra-ui/transition";
     ╵ ~~~~~~~~~~~~~~~~~~~~~~~

```

X [ERROR] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle]

```
node_modules/esbuild/lib/main.js:1363:21:
  1363 │ let result = await callback({
       ╵ ^

at packageEntryFailure (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28691:11)
at resolvePackageEntry (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28688:5)
at tryNodeResolve (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28422:20)
at Context.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28183:28)
at Object.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:44123:64)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:65713:21
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39872:34
at async requestCallbacks.on-resolve (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1363:22)
at async handleRequest (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:726:13)      

```

This error came from the “onResolve” callback registered here:

```
node_modules/esbuild/lib/main.js:1282:20:
  1282 │ let promise = setup({
       ╵ ^

at setup (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39852:19)
at handlePlugins (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1282:21)
at buildOrContextImpl (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:971:5)        
at Object.buildOrContext (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:779:5)     
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:68
at new Promise (<anonymous>)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:27)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2015:58)
at prepareEsbuildOptimizerRun (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:45866:35)

```

The plugin “vite:dep-pre-bundle” was triggered by this import

```
../node_modules/@chakra-ui/accordion/dist/chunk-WA4Q3J7T.mjs:11:25:
  11 │ import { Collapse } from "@chakra-ui/transition";
     ╵ ~~~~~~~~~~~~~~~~~~~~~~~

```

X [ERROR] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle]

```
node_modules/esbuild/lib/main.js:1363:21:
  1363 │ let result = await callback({
       ╵ ^

at packageEntryFailure (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28691:11)
at resolvePackageEntry (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28688:5)
at tryNodeResolve (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28422:20)
at Context.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28183:28)
at Object.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:44123:64)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:65713:21
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39872:34
at async requestCallbacks.on-resolve (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1363:22)
at async handleRequest (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:726:13)      

```

This error came from the “onResolve” callback registered here:

```
node_modules/esbuild/lib/main.js:1282:20:
  1282 │ let promise = setup({
       ╵ ^

at setup (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39852:19)
at handlePlugins (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1282:21)
at buildOrContextImpl (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:971:5)        
at Object.buildOrContext (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:779:5)     
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:68
at new Promise (<anonymous>)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:27)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2015:58)
at prepareEsbuildOptimizerRun (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:45866:35)

```

The plugin “vite:dep-pre-bundle” was triggered by this import

```
../node_modules/@chakra-ui/modal/dist/chunk-XV7ZWFID.mjs:3:49:
  3 │ import { scaleFadeConfig, slideFadeConfig } from "@chakra-ui/transition";
    ╵ ~~~~~~~~~~~~~~~~~~~~~~~

```

X [ERROR] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle]

```
node_modules/esbuild/lib/main.js:1363:21:
  1363 │ let result = await callback({
       ╵ ^

at packageEntryFailure (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28691:11)
at resolvePackageEntry (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28688:5)
at tryNodeResolve (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28422:20)
at Context.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28183:28)
at Object.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:44123:64)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:65713:21
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39872:34
at async requestCallbacks.on-resolve (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1363:22)
at async handleRequest (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:726:13)      

```

This error came from the “onResolve” callback registered here:

```
node_modules/esbuild/lib/main.js:1282:20:
  1282 │ let promise = setup({
       ╵ ^

at setup (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39852:19)
at handlePlugins (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1282:21)
at buildOrContextImpl (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:971:5)        
at Object.buildOrContext (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:779:5)     
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:68
at new Promise (<anonymous>)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:27)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2015:58)
at prepareEsbuildOptimizerRun (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:45866:35)

```

The plugin “vite:dep-pre-bundle” was triggered by this import

```
../node_modules/@chakra-ui/modal/dist/chunk-JIPYISAW.mjs:18:22:
  18 │ import { Slide } from "@chakra-ui/transition";
     ╵ ~~~~~~~~~~~~~~~~~~~~~~~

```

X [ERROR] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle]

```
node_modules/esbuild/lib/main.js:1363:21:
  1363 │ let result = await callback({
       ╵ ^

at packageEntryFailure (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28691:11)
at resolvePackageEntry (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28688:5)
at tryNodeResolve (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28422:20)
at Context.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:28183:28)
at Object.resolveId (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:44123:64)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:65713:21
at async file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39872:34
at async requestCallbacks.on-resolve (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1363:22)
at async handleRequest (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:726:13)      

```

This error came from the “onResolve” callback registered here:

```
node_modules/esbuild/lib/main.js:1282:20:
  1282 │ let promise = setup({
       ╵ ^

at setup (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:39852:19)
at handlePlugins (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:1282:21)
at buildOrContextImpl (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:971:5)        
at Object.buildOrContext (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:779:5)     
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:68
at new Promise (<anonymous>)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2175:27)
at Object.context (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node_modules\esbuild\lib\main.js:2015:58)
at prepareEsbuildOptimizerRun (file:///C:/Users/HP/Desktop/Projects/GamingArena/gaming-arena/node_modules/vite/dist/node/chunks/dep-210e5610.js:45866:35)

```

The plugin “vite:dep-pre-bundle” was triggered by this import

```
../node_modules/@chakra-ui/modal/dist/chunk-O6Y2AQRF.mjs:12:27:
  12 │ import { fadeConfig } from "@chakra-ui/transition";
     ╵ ~~~~~~~~~~~~~~~~~~~~~~~

```

10:01:38 PM [vite] error while updating dependencies:  
Error: Build failed with 5 errors:  
node\_modules/esbuild/lib/main.js:1363:21: ERROR: [plugin: vite:dep-pre-bundle] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json.  
node\_modules/esbuild/lib/main.js:1363:21: ERROR: [plugin: vite:dep-pre-bundle] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json.  
node\_modules/esbuild/lib/main.js:1363:21: ERROR: [plugin: vite:dep-pre-bundle] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json.  
node\_modules/esbuild/lib/main.js:1363:21: ERROR: [plugin: vite:dep-pre-bundle] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json.  
node\_modules/esbuild/lib/main.js:1363:21: ERROR: [plugin: vite:dep-pre-bundle] Failed to resolve entry for package “@chakra-ui/transition”. The package may have incorrect main/module/exports specified in its package.json.  
at failureErrorWithLog (C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node\_modules\esbuild\lib\main.js:1639:15)  
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node\_modules\esbuild\lib\main.js:1051:25  
at C:\Users\HP\Desktop\Projects\GamingArena\gaming-arena\node\_modules\esbuild\lib\main.js:1515:9  
at process.processTicksAndRejections (node:internal/process/task\_queues:95:5)

---

<div class="post-metadata">

**Author:** ![kibbkibb](https://avatars.discourse-cdn.com/v4/letter/k/a9a28c/32.png) [@kibbkibb](https://forum.codewithmosh.com/u/kibbkibb)\
**Post date:** [July 12, 2023, 7:58pm UTC](https://forum.codewithmosh.com/t/react-typescript-project-issues-with-chakra-ui/21466/2 "2023-07-12T19:58:19Z")

</div>

solved by running this command:

npm i “@chakra-ui/transition”

---

<div class="post-metadata">

**Author:** ![jax](https://avatars.discourse-cdn.com/v4/letter/j/bbe5ce/32.png) [@jax](https://forum.codewithmosh.com/u/jax)\
**Post date:** [July 15, 2023, 7:35am UTC](https://forum.codewithmosh.com/t/react-typescript-project-issues-with-chakra-ui/21466/3 "2023-07-15T07:35:18Z")

</div>

Thanks for letting us know how you solved it 😃