Im in vue but its throwing a react error at me?

[CarelessCourage]

These are the only two lines I have added:

This is the error its throwing. For the record Im using Nuxt 3 but ive turned off SSR just to be sure thats not causing the issue.

Heres my setup:

[Horatzio]

Seconding this issue. I'm having a similar problem - ./node_modules/@theatre/studio/dist/index.js Module not found: Error: Can't resolve 'react' in '~\node_modules\@theatre\studio\dist'

[Pamavoc]

This problem seems to be related to Vite (used as the main bundler in nuxt) which does not support ENV variables.

It uses import.meta.env.XXX instead of process.env.XXX .

For Nuxt there are two solutions I believe: switch to webpack bundle (because it supports env variables natively) or add this to your nuxt.config.js and keep vite bundler :

export default defineNuxtConfig({ vite: { define: { "process.env.TESS_ENV": process.env.ENV, }, } }) It works for me with "nuxt": "3.0.0-rc.12".

[plcdnl]

Same error but latest temporary solution doesn't work

[dghez]

Same error but latest temporary solution doesn't work

@plcdnl / @Horatzio same issue here, I'm on Nuxt 2.15.7 (so assume webpack) and I get the same issue

Any clue on this?

[plcdnl]

nope, sorry :(

[dghez]

@plcdnl Well, I made the dumbest thing ever, I've added react to my deps yarn add react and it started working again. I'm controlling the studio init manually so it won't affect the bundle size

 store.isDebug && this._initDebug()
  .....

  async _initDebug(){
    // // THEATRE
    const studio = (await import('@theatre/studio')).default
    studio.initialize()
    const project = getProject(labels.projectName, {state})
    const sheet = project.sheet(labels.sheets.hero)

    // STATS
    const Stats = (await import('stats.js')).default
    this._stats = new Stats()
    document.body.appendChild(this._stats.dom)
  }