I have my App react (create-app-react...) My app access to file .json in the folder assets. In my test in local no problem but when publish in IIS (npm run build) can't access a this file .json, in console obtain this error: GET http://localhost:3700/assets/locales/en/isotope.json 404 (Not Found).
My structure app ...
assets
locales
es
isotope.json
static
css
js
index.html
...
Can you help me??
The problem was not having included in the MIME Types (IIS) the .json.
Now Work It!!!
Thanks
You have to manually copy the resources that are not added via require or import. Make sure you have assets folder in the site root on the server.
Related
I'm working on a React app, using Vite. Once I build the app, I have no problem seeing the images, but during development, I get the following error in the browser:
GET https://localhost:5173/uploads/2/6337005fd6d4d.png 404 (Not Found)
Images are supposed to be served from a folder at public/uploads. The favicon.ico at public isn't being served either (during development).
Ok, found the answer to my own question: In vite.config.js, I had to set the root of the project, and the publicDir, which by the way, must be set relative to the root.
I am trying to deploy a Django REST framework API and ReactJS app to AWS Beanstalk.
The API works if I use Postman.
When I try to load the main.js I get the error:
http://django-env1.eba-ispw2cg9.us-west-2.elasticbeanstalk.com/static/frontend/main.js
404 Not Found
I have moved the static/frontend folder to the main folder.
How can I check the directory structure and where exactly to put the static folder so that the above URL will find it and load?
I'm trying to embed an existing react app to my WordPress site using the plugin ReactPress. I created a react app inside the plugin section:
and added my build folder of the existing react app inside the path where is needed (using file administrator plugin):
The Path is wp-content/plugins/reactpress/apps/dase-mural-design. The problem is when I click on the URL Slug in order to see this section (where the build folder is placed) I don't see the react app I've just uploaded, I just see header and footer and these errors:
What I'm doing wrong? How can I fix it?
Thanks in advance.
Update:
I used FileZilla to upload these files but is still not showing anything. Any idea?
I changed the package.json homepage to: "homepage": "/wp-content/plugins/reactpress/apps/dase-mural-design/build",
But in the console of the WordPress site I see:
Thanks
It's an encoding issue, try setting your site encoding to utf-8 or uploading the files of your react app with a different tool, it could be the file manager plugin is changing the encoding when uploading.
Using ReactJS I made a Build (reactJs static, npm build) and uploaded it to Google Cloud Storage Bucket, but getting a issue with the Path and Build folder files. The app (/static website) running but could not fetch the files from the bucket directory for eg the index.html & logo. (404 or 403 error )
Structure: Parent Bucket > Build folder (index.html, static folder & other files inside Build)
Any one have any suggestion on this. How to resolve this?
Do I need to create an app.yaml for GCS Bucket or any alternative?
I have gone through the article quite similar but for AppEngine instead of Bucket. https://medium.com/google-cloud/how-to-deploy-a-static-react-site-to-google-cloud-platform-55ff0bd0f509.
I have tried with app.yaml file but does not work for me.
I had exactly the same issue as mentioned by the OP. I am sharing my version of solution just in case anyone else ends up here.
As shown in the screenshots by OP, the 403 errors showed up for me because the URL of the static files in build/static folder was not correctly configured by the react-scripts build script.
Eg:
The url for index.html file was https://storage.googleapis.com/{bucket-name}/index.html.
However, when the page loaded, it requested files having url https://storage.googleapis.com/static/js/main.f555c3e0.chunk.js. It should rather be
https://storage.googleapis.com/{bucket-name}/static/js/main.f555c3e0.chunk.js
This is happening because by default react-scripts build assumes that your files will be served from root folder of your host.
To fix this add the following field in package.json of your project
"homepage": "https://storage.googleapis.com/{bucket-name}"
This tells the build script that it needs to add a relative path for serving static files.
For details please refer: https://create-react-app.dev/docs/deployment/#building-for-relative-paths
In order to set the routes of a static website stored in Google Cloud Storage, you need to assign a suffix to your objects. In other words, using suffixes is the intended way to configure your website. You can see more information in Hosting a static website document.
For your main index page you should set MainPageSuffix and for the not found page 404.html you should set NotFoundPage as suffix.
You can see more information on how to configure your static web here
Third party application which I'm trying to integrate, asking to put a file inside a .well-known folder. how can I make that file accessible from URL? (example.com/.well-known/token.txt). site is deployed as a gitlab page. every attempt I tried gives 404 error.
If you put your ".well-known" folder inside the "static" folder it should get deployed to the root of your website as you expect.