funny-blue•2y ago

nextjs project wont show after i install NPM package

I created a Nextjs, Materiual-UI, Supabase/Supabase project,,, I installed Styled-Compomnents And now it wont show, it errors and gives me this:

Node.js v18.15.0
Starting the development server...

    at makeError (/Users/MYMAC/Desktop/refine-react-app/node_modules/execa/lib/error.js:60:11)
    at handlePromise (/Users/MYMAC/Desktop/refine-react-app/node_modules/execa/index.js:118:26)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async D (/Users/MYMAC/Desktop/refine-react-app/node_modules/@refinedev/cli/dist/cli.js:22:330) {
  shortMessage: 'Command failed with exit code 1: /Users/MYMAC/Desktop/refine-react-app/node_modules/react-scripts/bin/react-scripts.js start',
  command: '/Users/bretemmerich/Desktop/refine-react-app/node_modules/react-scripts/bin/react-scripts.js start',

Node.js v18.15.0
Starting the development server...

    at makeError (/Users/MYMAC/Desktop/refine-react-app/node_modules/execa/lib/error.js:60:11)
    at handlePromise (/Users/MYMAC/Desktop/refine-react-app/node_modules/execa/index.js:118:26)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async D (/Users/MYMAC/Desktop/refine-react-app/node_modules/@refinedev/cli/dist/cli.js:22:330) {
  shortMessage: 'Command failed with exit code 1: /Users/MYMAC/Desktop/refine-react-app/node_modules/react-scripts/bin/react-scripts.js start',
  command: '/Users/bretemmerich/Desktop/refine-react-app/node_modules/react-scripts/bin/react-scripts.js start',

It kinda looks like my tsconfig.json is diffrent: PREVIOUS:….

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "strict": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "baseUrl": "src",
    "paths": {
      "*": ["./*"]
    }
  },
  "include": ["src"]
}

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "strict": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "baseUrl": "src",
    "paths": {
      "*": ["./*"]
    }
  },
  "include": ["src"]
}

AFTER ADDING STYLED COMPONENTS:

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "strict": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve"
  },
  "include": [
    "src"
  ]
}

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "strict": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve"
  },
  "include": [
    "src"
  ]
}

8 Replies

kapa.ai•2y ago

Hi @justcode123. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Hmm, I don't know enough to give you a confident answer yet. The information extracts provided are specific to refine, a React-based framework, and not directly related to your Next.js, Material-UI, and Supabase project. However, I can still try to help you by suggesting you double-check your tsconfig.json and ensure that it's configured correctly for your project. Also, make sure that you have installed and configured all the necessary dependencies for Styled Components. For more information on refine, you can check out the documentation here (https://refine.dev/docs). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2y ago

<@694853013466251365> kapa.ai is still learning and improving, please let us how it did by reacting below

ambitious-aqua•2y ago

You might still need to add baseUrl and paths to the tsconfig if your app includes alias imports. Not sure if they are related with the error. Do you still have next.js package installed, at first sight this looks like an issue with node modules and package.json. If you think your package.json is good to go, can you please try removing node_modules and install again?

funny-blueOP•2y ago

That worked!!!! I tried to “git revert” but it didn’t work….. how do i go back to a previous commit? THIS WORKED THO. Thank you

ambitious-aqua•2y ago

git reset --soft HEAD~1 should undo the last commit and stage the changes it contains

funny-blueOP•2y ago

I just installed styled components again, same thing Ok, it’s supposingly is working

ambitious-aqua•2y ago

Can you confirm after removing node_modules and running npm install, its still not working with the same error on terminal?

funny-blueOP•2y ago

It’s working, idk what it was