#React-Refresh Problem

19 messages · Page 1 of 1 (latest)

shell tiger
#

Thanks for your question :clap:, if someone gives you an answer it would be great if you thanked them with a :white_check_mark: in response. This response will earn you both points for special roles on this server.

You can also use /ai to get help from the bot ·
#

@shell tiger t1_zxs's Question:

`ERROR in ./src/views/Testing1.jsx 1:40-130
Module not found: Error: You attempted to import /Users/nimaigarg/Downloads/gourmetai-main/node_modules/react-refresh/runtime.js which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.
You can either move it inside src/, or add a symlink to it from project's node_modules/.

I'm getting this error for like all of my view pages in my code (25 of them), this is just one of them
I removed node_modules and package-lock.json as well as reinstalled them
And I don't know what else to do`

This error usually indicates that there is an issue with how your project is set up, specifically regarding file paths and module resolution. Here are some steps to help you resolve the issue:

  1. Check Project Structure: Ensure that your project structure follows the conventions required by your build tool (e.g., Create React App). Files related to source code should be contained within the src/ directory, and all imports should be relative to this directory.

  2. Verify Imports: Go through your Testing1.jsx file (and the others) and verify that all import statements are correctly referencing files within the src/ directory. An incorrect path could lead to the error.

  3. Check package.json: Make sure your dependencies in package.json are correct and the versions are compatible. Sometimes, certain versions of packages can cause issues.

  4. Update or Reinstall Dependencies:

    • Run:
      npm update
    • Or, if you're using Yarn, run:
      yarn upgrade
    • Alternatively, remove the node_modules and re-install dependencies:
      rm -rf node_modules
rm package-lock.json  # or yarn.lock if using Yarn
npm install

  5. Check for Symlink Issues: If you are using a symlink in your setup, ensure it's set up correctly and pointing to the right directories. If

#

you don’t need a symlink, try removing it to see if that resolves the issue.

  1. Config Adjustments: If you're using a custom Webpack configuration, ensure that the configuration allows for imports from the specified directories. If you're using CRA, you may need to eject to make modifications.

  2. Clear Cache: You could try clearing any caches that might have been saved. For example, if you’re using npm:

    npm cache clean --force

  3. Look for Stale Tomcat Cache: If using a Tomcat server or another build server, ensure that there are no old builds cached causing conflicts.

  4. React Scripts & React Refresh: If you are using Create React App and facing issues with react-refresh, you might try updating or fixing related packages by running:

    npm install --save-dev react-refresh

  5. Fallback: If none of the above steps work, consider creating a new project using Create React App and incrementally copy your files over while ensuring that imports are properly resolved.

Try one or more of these solutions, and hopefully, one will resolve the issue.

shell tiger
#

Check these

#

They might work

novel parrot
#

Alright bet

#

Lemme see rq

#

@shell tiger

#

Do you want my repository?

#

And you can try yourself

shell tiger
#

Alright

novel parrot
#

Ber

#

*BEt

#

*Bet

#

Give me your email cuz it's private

#

I'll add you to it

shell tiger
#

Dms?

novel parrot
#

Yeah I DM'ed it