I am trying to create a react js app, for this reason I have installed node js on my windows machine and executed the command: npm install -g create-react-app
inside a directory 'C:\Users\Desktop\ReactDemo' but the result of command created a directory at AppData\Romaing\npm\create-react-app.
I am surprise why app created in some other directory. My assumption was like if I create an empty directory and from that location in the command line, we init git then that directory becomes git flavored, isn't it.?
Similarly, I am expecting, if I create an empty directory and init react-js flavor that folder should working react-js app, but it isn't instead created a new directory. Can someone please help me understanding how to turn normal directory to working react-js directory.?
npm install -g create-react-app install globally create-react-app and it's not the command to create react app.
If you just want to create some app you could use: npx create-react-app my-app see: https://github.com/facebook/create-react-app
Additionally please keep in mind that react app created by create-react-app needs to have specific naming convention
Related
Wanted to create a new react app, and ran both npx create-react-app and init react-app command in my Mac terminal but it's not working.
Tried a couple of times, but sometimes the folder is created with a package.json file only. Then everything stopped downloading. What could be the issue?
Screenshot of the output in the terminal:
According to your screenshot, there is no problem when you initialize your react project.
I think your local network may not be good enough. To create a react app, you need to install many third-party nodes_modules then cause mistakes.
Therefore, you can try to change the npm source, such as taobao（ https://registry.npm.taobao.org ）
npm config set registry xxx
And then use the craete-react-app to initialize the app.
I am starting with a new code base and I am a little confused. I look in package.json and specialized '.' configuration files and I don't see any configuration. Yet the components return JSX so there is some kind of transpiling happening. The build goes to a specific folder. There is a port assigned that gets assigned on 'npm start'. I could go on and on but the point is all of this seems to be 'normally' configured. But I am not sure where to look for this configuration or how best to modify it. For instance what if I want to modify the 'configuration' to use TypeScript? Or add testing?
These configurations are by default created when you create a react project and the role of the package.json file is to show you the versions that you are using if you will include externals library to use inside your app.
for using typescript or using anything external and including it inside your app then you will include it using npm which is responsible to add your new packages inside the node_modules folder and the version number inside your package.json.
for using test this will be normal files you will create inside your app and use npm run test and it will show for you the results.
for making your project to be typescript then you will use
npx create-react-app my-app --template typescript
# or
yarn create react-app my-app --template typescript
How to add React to an existing Electron app?
I have a CLI Node.js application to which I'm intending to add a desktop GUI using ElectronJS and React. I now have succesfully combined the original CLI app and Electron so that when I run npm start an Electron powered window pops up and the old app starts doing its thing. Is there an easy way to add React to the stack or do I need to start my project over with this new architecture in mind?
Now when I go to the root directory of my project and try to npx create-react-app it refuses to initialize because there's already stuff in there. If I create a new subdirectory to my project in which I would then initialize the React app then I'd have node_modules, package.json etc. duplicates and a weird layered structure which probably isn't the recommended way to go about if it would even work...
Create a subdirectory and run create-react-app there. Afterwards, just move the contents up a directory and delete the empty directory.
Example:
cp package.json package.json.backup
mkdir temp
cd temp
npx create-react-app test-app
mv test-app/* ..
cd ..
rm -fr temp
You can run the above commands in Git Bash if you're on Windows.
Afterwards, you will want to manually merge the package.json from create-react-app with your old one that's now called package.json.backup.
Iam trying to create react folder structure with npm version 8 but still error.
How to create react folder structure with Ubuntu command and which version using to npm and connect with mongodb database.Please help me....
Ubuntu command is not related to react. I use create-react-app package to create react app. Then I run create-react-app myApp and it creates my app
I have some code that I've written in a RN app, and I want to open-source and post it on npm for others to consume. What's the best workflow for writing a pure JS React Native library? Thanks!
So these are the steps on how to create a re-usable React Native library and publish it to NPM:
Create an account at https://npmjs.com
Open command line terminal, type:
npx create-react-native-library your-library-name-here
cd your-library-name-here
npm login
npm install --save react-native-builder-bob
npm install
npx react-native-builder-bob build
npm publish
You can verify at your https://npmjs.com home page that this library is now there. Now, to test it you have to create another React Native application, which will depend on the newly created library:
Open terminal
npx react-native init MyTestApp
cd MyTestApp
npx install --save your-library-name-here
Modify App.js main code entrypoint and make a call to a method in your library that multiplies two numbers to prove that the library works.
Open another terminal, go to project root folder and type:
npx react-native start.
From the main terminal at step#1, type:
npx react-native run-android
These steps needs a properly installed Android Studio IDE and node (Nodejs). The step to create the react-native library already has one callable pre-made test method called multiply(a, b).
If your module is pure JS, you can simply follow these steps to publish to npm:
https://docs.npmjs.com/getting-started/publishing-npm-packages
Essentially, you are exporting a component from your main file (index.js). This should all be defined in your package.json
A RN example: https://github.com/ugiacoman/react-native-calendar
I'll be publishing this package to npm soon :)
If your module requires native code, you can use this generator to setup your project:
https://github.com/frostney/react-native-create-library