I have inherit a ReactJS project. There is strange that it does not have App.js file. How can I know where to start with project? I mean how can know where is the entry point of the project?
In your "src" folder there would be "index.js" file, which render your main component in "public/index.html" root element.
And other components can be added in index.js file.
Default index.js file:
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById("root")
);
So, your entry component should be at "<App />".
In your app there is no App.js.
So, Whichever component is there, that's your entry component.
Go to index.html file in your project. There a component will be called after the header tag. Get the name of component and try to find the component in your project directory. The file name of component will most probably be Component.js
Related
I'm working on my website with react, but the files were getting a messy so I wanted to organize them into further sub-folders. I've always imported components from the component folders using "../" but now that my components folder is further than the reach of ../ I assumed that all you had to do was refer to it again, like ../../ but it does not seem to be working.
Files
src > Components > Component1 (file)
src > Pages > ICS4U0 > ICS4U0_DS (file)
The goal was to import Component1 into the ICS4U0_DS file
I referred to import as: import Component1 from '../../components/Component1';
But I got the error message is
Module not found: Error: Can't resolve '../../components/Component1' in '/Users/stephenni/portfolio/src/pages/ICS4U0/ICS4U0_DS'
When I refer to the import as: import Component1 from '../../../components/Component1';
I get the error message
Module not found: Error: You attempted to import ../../../components/Component1 which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.
You can either move it inside src/, or add a symlink to it from project's node_modules/.
Help pls :D
i think the problem might be coming from your exports in Component1 file, try Checking if Component1 has got a default export.
export default Component1
I hope this helps
As I am new to React JS, what is the difference between "homepage" in package.json and router "basename" attributes in React JS?
I just want to add context-name to my project URL. By using the relative path in "homepage" in package.json, it needs the respective folder under the "build" folder.
For example, if I use "homepage":"/login", it expects image files, static files and other related files except index.html under "login" folder under "build" folder. But I need to add only the context-name to my project. How to achieve it?
I'm beginner in react and now I check a project that is like crisp and all off react component is in a one jsx file. I studing react and test some project but None of them is'nt like this.
this project dosn't have any ClientApp folder and subfolders.
this project is asp core and have signalR . file jsx use in a view action and run nice.
and how I can split componnent from main file jsx. I should create Appclient folder or not.
[![enter image description here][1]][1]
I have created a react typescript project using "create-react-library".
The project export a component, let's call it "A".
The "A" component render an svg image which is inside the component folder.
But when i compile the library project (using microbundle), there is no assets in dist folder.
And as a result, if i use component "A" in a test example project, i cannot see the svg image.
I have not found any example which handle this scenario.
I had a template, that I wanted to convert to React JS components, and I successfully did that. As all of us know, that there are bunch of libraries used in a template. What I first did is, I inserted the .css and .js libraries into the react app through the index.html file, in the public folder of the create-react-app boiler plate. It successfully used the styles and scripts from the inserted .js and .css files. But the problem occurred when I added routing to the react app.
When, I navigate to another route through a link, the component loads, but the required styles and scripts doesn't loads. I don't know what the problem is. I tried to import the scripts and styles to the parent component which is home.js. The styles worked properly, but the libraries used in template are :
bootstrap.min.js,
eva.min.js,
feather.min.js,
jquery.min.js,
jquery-slim.min.js, and
popper.min.js.
On each import of the above libraries, it shows different errors. But as an example, for jquery.min.js it shows the following error :
In public folder add the following code in of the index.html page.
<base href="/">