Question:
While npm run dev do nothing and crash in Nodejs?

Problem

I'm a beginner in nextJs and I'm trying some tuto. So, I installed nextjs as recommended in the doc.


Here is what I do:


  $ npx create-next-app@latest crm-immo


    ? Would you like to use TypeScript? » No / Yes

    √ Would you like to use TypeScript? ... No / Yes

    ? Would you like to use ESLint? » No / Yes

    √ Would you like to use ESLint? ... No / Yes

    ? Would you like to use Tailwind CSS? » No / Yes

    √ Would you like to use Tailwind CSS? ... No / Yes

    ? Would you like to use `src/` directory? » No / Yes

    √ Would you like to use `src/` directory? ... No / Yes

    ? Would you like to use App Router? (recommended) » No / Yes

    √ Would you like to use App Router? (recommended) ... No / Yes

    ? Would you like to customize the default import alias (@/*)? » No / Yes

    √ Would you like to customize the default import alias (@/*)? ... No / 

    Yes

    Creating a new Next.js app in 

    C:\Users\kgonc\Desktop\Projets\crmimmo\crm-immo.


    Using npm.


    Initializing project with template: default-tw



   Installing dependencies:

   - react

   - react-dom

   - next


   Installing devDependencies:

   - typescript

   - @types/node

   - @types/react

   - @types/react-dom

   - autoprefixer

   - postcss

   - tailwindcss

   - eslint

   - eslint-config-next



   added 328 packages, and audited 329 packages in 1m


   115 packages are looking for funding

    run `npm fund` for details


   found 0 vulnerabilities

   Initialized a git repository.


After that, I run VS and I run dev: >enter image description here

is my package.json:

  

{

     "name": "crm-immo",

     "version": "0.1.0",

     "private": true,

     "scripts": {

       "dev": "next dev",

       "build": "next build",

       "start": "next start",

       "lint": "next lint"

    },

     "dependencies": {

       "next": "13.5.4",

       "react": "^18",

       "react-dom": "^18"

    },

    "devDependencies": {

       "@tailwindcss/typography": "^0.5.10",

       "@types/node": "^20",

       "@types/react": "^18",

       "@types/react-dom": "^18",

       "autoprefixer": "^10",

       "daisyui": "^3.9.2",

       "eslint": "^8",

       "eslint-config-next": "13.5.4",

       "postcss": "^8",

       "tailwindcss": "^3",

       "typescript": "^5"

     }

   }


Then it stops 10 secondes after. No error is written. Just it stops.

I verified my 3000 port and it is empty. My Nodejs version is 18 my npm version is 9.8.1

So I don't understand why it does not work. I need your help. Thank you.


Solution

make sure your Node.js version matches the npm and npx version

$ node -v

v18.12.0

$ npm -v

8.19.2

$ npx -v

8.19.2


I tested the cli command everything is fine.

$ npx create-next-app@latest next-app

Need to install the following packages:

create-next-app@13.5.4

Ok to proceed? (y) y

✔ Would you like to use TypeScript? … No / Yes

✔ Would you like to use ESLint? … No / Yes

✔ Would you like to use Tailwind CSS? … No / Yes

✔ Would you like to use `src/` directory? … No / Yes

✔ Would you like to use App Router? (recommended) … No / Yes

✔ Would you like to customize the default import alias (@/*)? … No / Yes

Creating a new Next.js app in /home/eric/Desktop/node-playground/next-app.


Using npm.


Initializing project with template: app-tw 



Installing dependencies:

- react

- react-dom

- next


Installing devDependencies:

- typescript

- @types/node

- @types/react

- @types/react-dom

- autoprefixer

- postcss

- tailwindcss

- eslint

- eslint-config-next



added 329 packages, and audited 330 packages in 5m


115 packages are looking for funding

  run `npm fund` for details


found 0 vulnerabilities

Success! Created next-app at /home/eric/Desktop/node-playground/next-app



$ npm run dev


> next-app@0.1.0 dev

> next dev


(node:27921) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time

(Use `node --trace-warnings ...` to show where the warning was created)

  ▲ Next.js 13.5.4

  - Local:        http://localhost:3000


 ✓ Ready in 3.9s

 ✓ Compiled /page in 2.8s (493 modules)

 ✓ Compiled in 192ms (234 modules)

 ✓ Compiled in 394ms (484 modules)




refs

>https://nextjs.org/docs/pages/api-reference/create-next-app

>https://github.com/vercel/next.js/blob/canary/.node-version


Answered by: >xgqfrms

Credit: >StackOverflow


Blog Links

>How to manage the Text in the container in Django?

>Fix webapp stops working issue in Django- Python webapp

>Creating a form in Django to upload a picture from the website

>Sending Audio file from Django to Vue

>How to keep all query parameters intact when changing page in Django?

>Solved: TaskList View in Django

>Implement nested serializers in the Django rest framework

>How to filter events by month in Django?

>Sorting the restframework in Django

>Ways to access instances of models in view in order to save both forms at once in Django

>What makes index.html have such kind of name in Django?

>Fix Module Not Found during Deployment- Django

>Creating a Django with existing directories, files, etc.?

>How to Read a CSV file with PHP using cURL?


Nisha Patel

Nisha Patel

Submit
0 Answers