Web server pack issue .. Module not found - reactjs

I am beginner in React.js and tried many tutorials for seting up the environment for React.js!!
first it came
The CLI moved into a separate package: webpack-cli. Please install
'webpack-cli' in addition to webpack itself to use the CLI.
-> When using npm: npm install webpack-cli -D
-> When using yarn: yarn add webpack-cli -D module.js:472
throw err;
^
Error: Cannot find module 'webpack-cli/bin/config-yargs'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (F:\ReactJs\FirstReact\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:488:32)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
then i run the :
npm install webpack-cli
and then i get this error below several trying may tutorials
ERROR in multi (webpack)-dev-server/client?http://localhost:8080
(webpack)/hot/dev-server.js ./src Module not found: Error: Can't
resolve './src' in 'F:\ReactJs\FirstReact' # multi
(webpack)-dev-server/client?http://localhost:8080
(webpack)/hot/dev-server.js ./src main[2]

the problem is in your webpack.config.js , please check with typo with (module.export). it should (module.exports)

Related

React Native Error: Cannot find module metro/src/shared/output/bundle

command
npx react-native init gonative
I ran this command in root terminal (parrot linux) and encountered with error.
It says cannot find module 'metro/src/shared/output/bundle'
Node version : v17.3.0
npm version: 8.3.0
npx version : 8.3.0
output
Need to install the following packages:
react-native
Ok to proceed? (y) y
node:internal/modules/cjs/loader:936
throw err;
^
Error: Cannot find module 'metro/src/shared/output/bundle'
Require stack:
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/buildBundle.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/bundle.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/index.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/index.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/index.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/commands/index.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/index.js
- /root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/bin.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:999:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/buildBundle.js:64:22)
at Module._compile (node:internal/modules/cjs/loader:1097:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
at Module.load (node:internal/modules/cjs/loader:975:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:999:19) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/buildBundle.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/bundle.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/bundle/index.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/commands/index.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli-plugin-metro/build/index.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/commands/index.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/index.js',
'/root/.npm/_npx/7930a8670f922cdb/node_modules/#react-native-community/cli/build/bin.js'
]
}
Remove global react-native installer
npm uninstall -g react-native-cli #react-native-community/cli
Install metro bundler
npm install --save-dev metro metro-core
Close all terminal/shell, and then run your command again

React: create-react-app fails with error "Cannot find module 'libnpx'

OS-ubuntu
IDE-VS-Code
npx create-react-app was working fine,I wanted to work on a personal project when i run in to a suggestion that Create React App requires Node 14 or higher. I tried updating node using the following commands sudo npm cache clean -f and then sudo npm install -g n then i ran sudo n stable the following was installed installed : v16.13.1 (with npm 8.1.2).When i tried running npx create-react-app I got the following error
Error: Cannot find module 'libnpx'
Require stack:
- /usr/share/npm/bin/npx-cli.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> (/usr/share/npm/bin/npx-cli.js:3:13)
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 Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) {
code: 'MODULE_NOT_FOUND',
requireStack: [ '/usr/share/npm/bin/npx-cli.js' ]
}
What i tried after getting the error,
The solution below;
React: create-react-app fails with error "Cannot find module 'lodash'"
How do I approach resolving this problem so that I can get started with my personal project and learning the framework?
Restart your terminal after updating node version.
Restarted vs-code and it started working fine.Hope this helps someone facing the same error

Cannot find module 'delegates' in CRA yarn add node-sass

I have created a fresh app with CRA and want to add Sass support according to its official description which simply says to add it with yarn add node-sass
but this throws an error
error /home/.../frontend/node_modules/node-sass: Command failed.
Exit code: 1
Command: node scripts/install.js
Arguments:
Directory: /home/.../frontend/node_modules/node-sass
Output:
module.js:550
throw err;
^
Error: Cannot find module 'delegates'
at Function.Module._resolveFilename (module.js:548:15)
at Function.Module._load (module.js:475:25)
at Module.require (module.js:597:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/home/amir/WORKSPACE/daypay/daypay_v2/frontend/node_modules/are-we-there-yet/tracker-stream.js:4:16)
at Module._compile (module.js:653:30)
at Object.Module._extensions..js (module.js:664:10)
at Module.load (module.js:566:32)
at tryModuleLoad (module.js:506:12)
at Function.Module._load (module.js:498:3)
I dont know why but it seems node_modules where messed up though it was a new created app.
SO I hard coded the node-sass and #types/node-sass in package.json deleted the yarn.lock or (package-lock) and node_modules folder and run yarn install again

Yo angular generate error

I install nodejs and npm on ubuntu 14.04, by source code.
root#wemet:~/ang# npm version
{ http_parser: '1.0',
node: '0.10.34',
v8: '3.14.5.9',
ares: '1.9.0-DEV',
uv: '0.10.30',
zlib: '1.2.8',
modules: '11',
openssl: '1.0.1j',
npm: '1.4.28' }
I installed yo and generate-angular as global This is my full package install of local:
https://gist.github.com/thinksource/ba33f0cad073f3d4dc46
When I want to do:
root#wemet:~/ang# yo angular
module.js:340
throw err;
^
Error: Cannot find module '../../string/is-string'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (/usr/local/lib/node_modules/yo/node_modules/insight/n
ode_m odules/inquirer/node_modules/cli-color/node_modules/es5-ext/array/from/shim
.js:9:22)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
I do not know what is the is-string module. I check it at https://www.npmjs.com/ but can not find it.
When I run the bower cache clean:
root#wemet:~/ang# npm i make-iterator --save-dev
info trying registry request attempt 1 at 00:21:04
http GET https://registry.npmjs.org/make-iterator
http 200 https://registry.npmjs.org/make-iterator
info trying registry request attempt 1 at 00:21:04
http GET https://registry.npmjs.org/for-own
http 200 https://registry.npmjs.org/for-own
info trying registry request attempt 1 at 00:21:05
http GET https://registry.npmjs.org/for-in
http 200 https://registry.npmjs.org/for-in
make-iterator#0.1.1 node_modules/make-iterator
└── for-own#0.1.2 (for-in#0.1.3)
root#wemet:~/ang# bower cache clean
module.js:340
throw err;
^
Error: Cannot find module '../function/makeIterator_'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (/usr/local/lib/node_modules/bower/node_modules/mout/
rray/collect.js:2:20)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
I find the module make-iterator, but even if I install make-iterator and I still meet error when I run bower cache clean.
I get the problem, I need to upgrade my npm version from 1.4.28 to 2.1.2.
Thank you for your attention.
answer of #user504909 will solve the problem But Good Solution is Upgrade Nodejs version from 0.10.34 to 0.12.0 As the result of upgrading Nodejs version, npm version will upgrade too from 1.4.28 to 2.1.2
To Upgrade Nodejs Version according to nodesource Blog :
# Note the new setup script name for Node.js v0.12
curl -sL https://deb.nodesource.com/setup_0.12 | sudo bash -
# Then install with:
sudo apt-get install -y nodejs
For Answer about upgrade Nodejs version with Ubuntu OS -> See This Link

Yeoman angular generator error

When I'm using the angular yeoman generator, I'm getting the following error:
module.js:340
throw err;
^
Error: Cannot find module './lib/pack.js'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (C:\Users\kra\AppData\Roaming\npm\node_modules\generator-karma\node_modules\yeoman-generator\n
ode_modules\download\node_modules\decompress\node_modules\decompress-tarbz2\node_modules\tar\tar.js:171:16)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
Any idea why?
npm version 1.4.28
node version 0.10.33
yeoman version 1.3.3
Try remove your generator-karma and generator-angular, run npm cache clean, and install them again
I just had a similar issue, this might not be the solution but your version of npm is out of date, try typing:
sudo npm install npm -g
As referenced On the npm website (note they use sudo in the example but it might not be necessary). after that:
npm --version
Is currently 2.1.12 so it should be higher than that.
You can then try:
npm update
to upgrade everything to the latest version (See this page).
This may solve the problem.

Resources