Unable to create React.js project in WebStorm - javascript

I am going to create a React.js web application in WebStorm. I have installed create-react-app in /usr/local/bin and Node.js interpreter. I use Debian sid Linux distribution. When I try create project in WebStorm I receive this error:
/usr/bin/node /usr/local/bin/index.js .
module.js:538
throw err;
^
Error: Cannot find module '/usr/local/bin/index.js'
at Function.Module._resolveFilename (module.js:536:15)
at Function.Module._load (module.js:466:25)
at Function.Module.runMain (module.js:676:10)
at startup (bootstrap_node.js:187:16)
at bootstrap_node.js:608:3
Done
I hope for help.

Try installing both node and create-reat-app globally by using -g flag in npm and make sure both are available system wide. To make node-interpreter available globally try setting default in nvm or try installing nodejs-legacy.
Anyways Web storm provides coding assistance depending on the file extension. Such as if it is a .jsx file then auto completion helps you in writing react specific syntax and enhanced ES syntax.
Also even after creating the project via Webstorm you have to install dependencies though npm install.
So my suggestion is instead of getting stuck just create a project using only create-react-app from the console by typing create-react-app
and then everything will be set for you. Test the set up by going inside the project folder and running npm start you could see basic react app open in your browser.
For further coding you can open your project folder inside web storm and continue with your project

Related

How can I run nodejs in eclipse?(javascript runtime does not appear in eclipse preferences)

Maybe similar questions found but those are very old and recommending outdated plugins.
-I'm using eclipse Ide for enterprise java developers 2021-06 and installed Nodejs 16.3 and Npm.
As eclipse news
says, Eclipse Neon and later will support jnodejs by default and you can configure runtime but I don't see any runtime in javaScript section in preferences and any option related to nodeJs and JavaScript in import sections.
I tried to install nodeClipse plugin but encountered errors.
When I import nodeJs project as general project, I get this error.
C:\Users\Hamidreza Abroshan\Documents\workspace-spring-tool-suite-4-4.12.0.RELEASE.metadata.plugins\org.eclipse.wildwebdeveloper.embedder.node\node-v14.15.4-win-x64\node.exe index.js
D:\dclm\dclm-customer-interaction-worker\dclm\node_modules\grpc\src\grpc_extension.js:55
throw error;
^
Error: Failed to load gRPC binary module because it was not installed for the current system
Expected directory: node-v83-win32-x64-unknown
Found: [node-v93-win32-x64-unknown]
This problem can often be fixed by running "npm rebuild" on the current system
Original error: Cannot find module 'D:\dclm\dclm-customer-interaction-worker\dclm\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node'
Require stack:
D:\dclm\dclm-customer-interaction-worker\dclm\node_modules\grpc\src\grpc_extension.js
**Note: I can run this project from command line successfully with npm run start.
Thanks in advance.
I found this way, but if you found better way, please post your answer.
First, import the app as general project E.G, file>import>general>existing project in to workSpace.
Then, open project explorer view and find package.json.
Write click on that and choose run configuration.
choose launch npm and create new configuration.
Now, in npm command enter run start and in package.json file enter the file's address.
Hit run and your app will run successfully.
This config should be done for the first time and for later times, you can go to runAs and choose npm...
If you can not find package.json, open Cmd and navigate to project root folder and type npm run start and it will download some dependencies and create package.json also.

Node application not running on remote server, runned on PC

I have a program developed in javascript that runs in node, it works perfectly on my windows and ubuntu environment but for some reason, it does not work on a remote new server I installed it.
I did the same things I did with my personal environment, install node, install MongoDB, install the packages and run it. but for some reason, it shows an error it didn't show before
Error:
DONE Compiled successfully in 547ms
/home/servinfo/DynamicButtons/build/webpack:/src/routes.js:18
module.exports = app => {
^
TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
at Object.<anonymous> (/home/servinfo/DynamicButtons/build/webpack:/src/routes.js:18:1)
I execute it using backpack-core, I run "npm run dev" and showed me this error(actually bigger but this is what matters)
Usually what I do in these cases:
check node version
check package.json to have all the dependencies including devDependencies for package managers and other building services
remove node_modules/
remove package_lock.json
npm install again
That usually helps

react-native, bundling failed

I am new to react-native and have found an error that makes absolutely no sense to me.
I am trying to include a calendar library: https://github.com/wix/react-native-calendars
I have included the dependency for that library in my package.json file and run npm install
The project was running fine and as expected. I have simply added one line of code to the project:
import { Calendar, CalendarList, Agenda } from 'react-native-calendars';
Nothing else. However now I am getting a red error message when the app loads on device and this is what my console is saying:
error: bundling failed: Error: While trying to resolve module xdate
from file
/Users/Alex/Documents/workspace/mobile/node_modules/react-native-calendars/src/index.js,
the package
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/package.json
was successfully found. However, this package itself specifies a
main module field that could not be resolved
(/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js.
Indeed, none of these files exist:
*
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
*
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
at ResolutionRequest.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:103:15)
at DependencyGraph.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph.js:272:4579)
at dependencies.map.relativePath (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:376:19)
at Array.map ()
at resolveDependencies (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:374:16)
at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:212:33
at Generator.next ()
at step (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:313)
at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:473
at
However I have checked in the directory and in fact /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js does exist. However I do not see any of this part: (.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)`
As to how /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index can exist, that doesn't make sense because xdate.js is not a directory.
Any help?
It Usually happens if you try to install a module while your packager is open.
Try to delete node_modules folder and close the packager.
Then reinstall everything by npm install in your project directory.
First close your JavaScript bundler (Metro bundler in my case) and restart the application. This will create fresh dependency graph. This should solve the issue.
Just restart the bundler - no need to delete the Node Modules folder
I came across this issue when adding and using react-native-elements when using VS Code and Android Studio emulator on Linux Mint
In VS Code I had a terminal running Expo with Metro Bundler via 'npm start' command. After installing the react-native-elements in the folder (using 'npm install --save react-native-elements') and adding the import into the .js file I got the "However, this package itself specifies a main module field that could not be resolved" error.
In my case, this just involved a ^C in the terminal session to stop the Metro bundler and then running 'npm start' again. There was no need to delete the node modules folder at all.
If you're still getting the error even after deleting the ./node_modules folder and running npm install again, try doing the install with the --update-binary flag, i.e npm install --update-binary. This should clear out and rebuild any previously built packages on your machine.
Please don't delete the node modules folder.
The bundler has least to deal with node modules folder.
Instead close all the terminals. If using VS-code close that also.
Close all the local host server ports and if possible restart the system.
This might solve the issue.
If anyone have same issue, and remove node_module not working. Then you can try remove all node_module, package lock and using yarn to install node_module instead npm. Hope this help
None of the solutions above helped me except for restarting my MacBook. Wasted 30 minutes trying to fix this issue as I couldn't believe restarting my computer could be a solution.

AngularJS tutorial: NPM install gives error "cannot find module"

I'm having a problem where I follow the AngularJS tutorial exactly and it gives me errors. Part of the problem is that the tutorial itself is a little ambiguous with what commands you should be running and where. It seems to assume that as a newbie, you're a complete expert already.
THE INSTRUCTION
"Install Node.js
If you want to run the preconfigured local web-server and the test tools then you will also need Node.js v0.10.27+ (yeah totally, that thing... I know exactly what you're talking about and whether I'll need it or not).
You can download a Node.js installer for your operating system from http://nodejs.org/download/.
Check the version of Node.js that you have installed by running the following command:
node --version (got this to work through trial and error. Apparently you have to run this through Git. Node.exe is just a mirage that seems like a program that runs commands and stuff).
Once you have Node.js installed on your machine you can download the tool dependencies by running:
npm install"
Notice how it doesn't tell me whether I'm running this command in Node or windows command prompt or Git. It assumes I'm an expert and totally know what to do through osmosis.
So I run the command in Git...
THE ERROR
~/Desktop/angular-phonecat (master)
$ npm install
module.js:339
throw err;
^
Error: Cannot find module 'C:\c\Chris' Documents\Cash Receipts\previous\node.js\node_modules\npm\bin\npm-cli.js'
at Function.Module._resolveFilename (module.js:337:15)
at Function.Module._load (module.js:287:25)
at Function.Module.runMain (module.js:467:10)
at startup (node.js:134:18)
at node.js:961:3
Any idea what to do? Never had so much trouble installing a program in my life. 7 hours and counting.

Getting an error when running the basic Express project

I'm messing around with Node.js for the first time and decided to create a simple application using express. I followed the instructions from github in an empty directory like so:
npm install -g express
express
npm install -d
node app.js
When navigating to localhost:3000 I get the follow error:
Express
500 Error: Cannot find module './lib/jade'
at Function._resolveFilename (module.js:332:11)
at Function._load (module.js:279:25)
at Module.require (module.js:354:17)
at require (module.js:370:17)
at Object. (C:\dev\gravity_kata\node_modules\jade\index.js:4:5)
at Module._compile (module.js:441:26)
at Object..js (module.js:459:10)
at Module.load (module.js:348:31)
at Function._load (module.js:308:12)
at Module.require (module.js:354:17)
When looking under node_modules\jade\lib I see all of Jade's library files, but no jade folder. So I created a folder under lib called jade and moved the library files there and now my default application works.
Now, seeing as I have nearly no experience with Node.js and Express I'm pretty sure I did something wrong. Does anybody have any idea what is going on here?
Edit:
I dove into the Jade code. Under Jade's index.js file it requires lib\jade and looking under the lib folder, there was no jade.js file. Well, that is the problem, but why is the jade.js file missing? When pulling the Jade source from npm, there is a jade.js file under the lib directory. I copied the lib folder from the downloaded source into the Jade module for my project and it works fine now.
So for some reason, npm isn't pulling down the jade.js file. The version in the packages.json file match the source i pulled down, 0.21.0. Anybody have an idea on why this happened?
cd to your express project folder and run "npm install", this will install all dependencies
For me, on windows, jade version 0.22.0 fixed the issue.
it probably has to do with the fact, that you installed express globally (-g), but the npm install -d was done locally. try to install them both globally, or as i would prefer, both locally:
sudo npm uninstall express -g
npm install express
npm install jade (or npm install -d)
Really make sure that all the module requires are correct. Javascript is very funny about telling you what is actually wrong. Try removing the jade template line and see what happens then.
I just found this problem with the error of jade module. Looks like the jade folder was doesn't created automaticly (some kind of bug). Now i resolved this with reinstall jade. After that the jade folder was automaticly created.
use npm uninstall gulp-jade and then install gulp-jade again

Categories

Resources