Is there any way to specify that create react app to not create src folder, rather I want the files to stay at root directory so I can work on my project.
I'm afraid, there is no way.
From the documentation about the folder structure
For the project to build, these files must exist with exact filenames:
public/index.html is the page template;
src/index.js is the JavaScript entry point.
Even if you try to use a custom template, it requires src/index.js or src/index.tsx files to exist
There are two possible solutions you can try:
Use craco and adjust webpack configuration to allow the source code to be in the root folder
Eject create-react-app and re-configure webpack
Related
When we create a reactjs project with the npm run build command, links to the "static" folder are created with a / before. Example: src = "/static/css...". When we are going to host on a domain... https://dominio.com/app. We have to update all links by removing the / or placing the static folder inside the root of the domain. How can we specify the root directory for /app/static when creating the project with the npm run build command?
You can specify homepage in your package.json
"homepage": "http://mywebsite.com/app",
Here is Create React APP docs reference
I just started using docz and added it to an existing project. I got a component from my react folder to show up but it is missing styling so I am trying to import my SASS files into my docs.mdx file. I followed the directions on https://www.docz.site/docs/usage-with-css-preprocessors and added the below to gatsby-config.js.
plugins: ['gatsby-plugin-sass']
But everytime I run yarn docz dev, the .docz folder where I have the gatsby-config file keep getting reset and it removed the gatsby-plugin-sass line. Am I missing anything?
File structure below. (Only showing the folders and files I referenced)
- .docz
--- gatsby-config.js
- react
--- components
--- docs
------ docs.mdx
- styles
---
---
I solved this problem today...
You need to create a copy of the gatsby-config.js and place it in your root folder (same directory where your src folder is). This automatically creates a gatsby-config.custom.js file in your .dist folder.
Then you add 'gatsby-plugin-sass' to the plugins array of the custom JS created. This should have been installed in your package.json already.
Then run yarn docz dev and you're good to go.
Also note that you need node-sass installed in package.json
I created a build of my creat-react-app reactjs application. It is very simple for now.
So I am loading this react app from within a web application, but it is loading not from the root but from a subdomain.
The problem is the css and js files are expected to be at the root ie.
/static/js/main.3a52edf1.chunk.js
How can I change this to:
/public/app/static/js/main.3a52edf1.chunk.js
I am currently justing doing yarn run build to generate my build.
For that you can you the homepage attribute in pacakge.json
References:
https://til.hashrocket.com/posts/xtgpx9kssz-set-the-relative-path-of-assets-in-a-cra-app
https://create-react-app.dev/docs/deployment/#building-for-relative-paths
In your package.json set the homepage attribute to:
"homepage": "."
Now, all your imports will be relative to your index.html
I'm trying to use the create-react-app in an existing app without using the default index.html built in that links the scripts generated by running yarn start. These files include /static/js/bundle.js, static/js/0.chunk.js, static/js/main.chunk.js, and /main.somehash...hot-update.js
I set INLINE_RUNTIME_CHUNK=false in my .env but no files ever get generated in the static folder when running yarn start.
You can either eject your project or use react-app-rewired to customize your webpack configuration. This way, you can modify the path to output js.
How do I add support for .scss file in my create-react-app application?
The current method, described in the documentation, creates a .css files and I have to import that to make it work. What I require is to import .scss directly into the components.
There are several guides on doing this using webpack config files. But I don't have a config folder in my create-react-app or any webpack-config.dev.js.
Is there a simpler way to do so?
You can run eject to have your webpack.config.
Try this link.