We Keep Coding

Only index.js works in reactjs

I am actually just getting started with Reactjs. So as i installed all the React packages on my PC using npm, i deleted all the src files which were in it because they were just sample files, i wanted to create on my own, but the problem is that my main js file name was "original.js" while it was demanding that "index.js" can't be found. So i changed my file name to "index.js" and now it works. Can someone tell me how to find the settings where i can see this issue so that i don't have to name my every main rract file as "index.js".
Thank you

Generally in the web development world (not just React), we use index.* files instead of main.* files.
If you would like to rename it, you might need to do some complex stuff like ejecting the app from create-react-app, and then changing webpack.config.js, but that seems way too advanced for you.
Instead I would recommend what most tutorials online say to do, which is keep index.js as the entry point of your app and import your Main component into it, like so:
// src/index.js
import React from "react";
import ReactDOM from "react-dom";
import Main from "./Main";
ReactDOM.render(
<React.StrictMode>
<Main />
</React.StrictMode>,
document.getElementById("root")
);
// src/Main.js
import React from 'react';
const Main = () => {
return (
<h1>My main component</h1>
);
};
export default Main;

react.js npm package can't be resolved

I'm trying to create a simple React module. My project structure looks like this :
project
|---src
|---Login.js
|---login.css
|---index.js
...
I have used create-react-app boilerplate.
Now when I have published the repo, it gives me :
Could not find module in path: 'react-mua-login' relative to '/src/index.js'
What is the problem actually ?
Repo : https://github.com/maifeeulasad/react-mua-login
npm package name : react-mua-login
codesandbox : https://codesandbox.io/s/react-mua-login-sample-x12dr?file=/src/index.js

Import Login component correctly:
import React from "react";
import ReactDOM from "react-dom";
import Login from "react-mua-login/src/Login";
const rootElement = document.getElementById("root");
ReactDOM.render(
<React.StrictMode>
<Login />
</React.StrictMode>,
rootElement
);
Working code
EDIT
If you want to use method like import Login from "react-mua-login", you should export Login component from your main entry file.
For example, you can create index.js in the project root directory and export Login component like this:
import Login from "./src/Login";
export default Login;
Recommended readling list: Preparing a React component to publish on npm

Doesn't look like react-mua-login is a library but an application. You cannot import anything from it and it generates a weird error.
You need a main property in react-mua-login's package.json so you can import things from it.
Also, you should probably move some dependencies in react-mua-login from dependencies to peerDependencies or devDependencies.
#testing-library/jest-dom dev
#testing-library/react dev
#testing-library/user-event dev
react dev & peer
react-dom dev & peer
react-scripts dev
It is often best that a lib doesn't ship with its own version of dependencies (especially react)

npm is only updating when changes are made in index.js

I have just started learning React and I am running the server with the command npm start but the problem is whenever I am making any changes in the index.js file it is updating it on the website but whenever I am importing some other apps and making changes in those apps it is not updating the website .
How can I update my site on updating any file in the project ?
Here is my header.js file
import React from 'react';
const user = {
name : 'Brijesh',
lastname : 'Maurya',
age : 20
}
const Header = () =>{
return (
<div>
<div>{user.name}</div>
</div>)
}
export default Header;
Here is index.js file
import React from 'react';
import ReactDOM from 'react-dom';
// Components
import Header from './components/header'
const App = () =>{
return (
<div>
<Header/>
</div>
)
}
ReactDOM.render(<App/>, document.querySelector('#root'));

As your issue is resolved by creating another app , maybe you should think over the flow you went through while making those files .
As you mentioned that you have just started learning react , I think you might have done something like deleting all the files and then creating new files from scratch.
Anyways , welcome to the world of React JS !

It sounds like whatever server npm start is running - probably a node server - has Hot Module Replacement configured and for the other apps that you are running HMR is not configured.
You can learn more about how to configure HMR on Webpack's site here:
https://webpack.js.org/concepts/hot-module-replacement/
And about React Hot Loader here:
https://gaearon.github.io/react-hot-loader/getstarted/
If npm start runs the wepack-dev-server it may be as simple as running the server with the --hot flag.

Unable to compile react application as it says "Module not found"

I have been trying to execute a very simple react application, but for some reason I'm unable to compile it. When i try to compile it in bash using "npm start", i get the error stating "Failed to compile: ./src/index.js
Module not found: Can't resolve './registerServiceWorker' in '/Users/Pruthvi/Desktop/ReactApplication/my-app/src'"
can anybody help me as I am a new bee to react application!

By default, create-react-app will create a progressive web app, as documented here. The progressive web app relies on registerServiceWorker() in the registerServiceWorker.js file. You have apparently deleted this file, so your project no longer builds.
You have two choices:
Keep your project as a progressive web app, in which case you should simply restore the original state you had after first creating.
Opt out of the progressive web app features.
In order to opt out of the progressive web app features, you need to modify your src/index.js file as follows:
Delete the import of the registerServiceWorker.
Delete the registerServiceWorker() call.
Your src/index.js will then look like this:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
// Deleted -- import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('root'));
// Deleted -- registerServiceWorker();
Once you've made those modifications to your index.js, you can safely delete the registerServiceWorker.js file (which it appears you've already done based on the error message you've posted).
The documentation gives a more complete description of how to opt out and some of the consequences of having a progressive web app.

If you are new to react and need to build apps fast you can try
create-react-app by facebook
it a command line tool that will help you build better react app fast with zero configuration you can learn more from the link above and its easy to use
also make sure that you use a good editor that can help you catch errors
and to help you and give you good answer the second time please provide your code to understand the problem well .

How to import an entire npm library into React Native, not just 1 file?

I've been trying to import the sjcl library, which has many files, but I'm only able to import 1 file from it.
From command line:
npm install sjcl --save
react-native link
In a RN JS file:
import sjcl from 'sjcl';
Looks like this doesn't import everything in the sjcl node package, it only imports file sjcl.js from node_modules/sjcl/. I also need sha1.js from node_modules/sjcl/core/sha1.js. I've tried various ways of importing it, but nothing works.
How can I import an entire npm library into a React Native project?

I had the same problem trying to load the ECC module, here is how I worked around it (I installed sjcl using npm). Create a file LocalExports.js in which put this
import sjcl from 'sjcl';
export {default as sjcl} from 'sjcl';
window.sjcl = sjcl;
then import like this in any other file
import {sjcl} from './LocalExports';
import 'sjcl/core/bn';
import 'sjcl/core/ecc';
*edit - I just found this link, which is the official way to do this
https://github.com/bitwiseshiftleft/sjcl/wiki/Getting-Started