Node.js on macbook with m1 chip. 'npm run dev' presenting with error

Question

I finally managed to get node and npm versions showing after installing node and npm.

npm install

managed to work after it kept failing. I ran

npm init 

and continuously hit enter then it worked after. Now whenever I run

npm run dev

i am presented with the following error;

    adnansaid@pc-200-38 smartMeals % npm run dev                   

> dev
> npm run development


> development
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js

[webpack-cli] Error: [BABEL]: Cannot find module '@babel/helper-plugin-utils'
Require stack:
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/available-plugins.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/filter-items.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/index.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/index.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/index.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/FileCollection.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/tasks/Task.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/tasks/ConcatenateFilesTask.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/components/Combine.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/components/ComponentRegistrar.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/Mix.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/setup/webpack.config.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/lib/webpack-cli.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/lib/bootstrap.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/bin/cli.js
- /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack/bin/webpack.js (While processing: /Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/index.js)
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js:8:26)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/available-plugins.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/filter-items.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/preset-env/lib/index.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/module-types.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/configuration.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/config/files/index.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/@babel/core/lib/index.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/FileCollection.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/tasks/Task.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/tasks/ConcatenateFilesTask.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/components/Combine.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/components/ComponentRegistrar.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/src/Mix.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/laravel-mix/setup/webpack.config.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/lib/webpack-cli.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/lib/bootstrap.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack-cli/bin/cli.js',
    '/Users/adnansaid/Desktop/MindSpace/smartMeals/node_modules/webpack/bin/webpack.js'
  ]
}

What can I do to fix this, as i want to be able to begin working. When working on the older macbooks installing node.js was the easiest thing to do now it seems to be the most difficult.

Answer 1

Install this npm package then try to run it

npm install --save-dev @babel/cli @babel/core @babel/preset-env