so i have a NextJs Project and I use NextJs Image Component for some images, when i build the project and run it locally everything works fine. But now i just deployed my project on digital Ocean and all the images that i'm using Next-Image-Component to serve isn't working.
I get this error
Network Tab error
I have tried importing the images using "relative path" and i have also tried importing the images with "absolute path"-"module import" but that didn't change anything.
I have also Deployed this same project on vercel just to check if it was something in my code and everything works fine on vercel. I know i can just keep it deployed on vercel but my team wants the project deployed on Digital ocean. I have contacted their support team and haven't gotten a response in days now.
Note Images that are served with the traditional img tag and images served with MUI avatar component are working fine.
Please has anyone encountered this issue or have any idea on how i could solve this on Digital Ocean
So for anybody that's having this same issue i was able to solve this by installing "sharp" package for my production app which was recommended by NextJs,Here
Vercel handles installing this for you that's it seemed to work on vercel.
Hope this helps somebody else
Related
I am working on a NestJS application which is part of an Nx monorepo. I tried Vercel, but it conflicted with the deployment of UI apps. Heroku is paid now. I want to learn how to deploy a NestJS application with CI/CD enabled. Whenever there is a push to the main branch, the code should be automatically deployed like NextJS via Vercel. I have been stuck at this for a few days and have tried AWS's EC2, Beanstalk, and Serverless. I am doing something wrong, which is why I keep failing. It would be great if I get a resource on the same. I appreciate any help provided.
I tried to follow Deploying nestjs server created in NX monorepo, but it is completely a different thing.
I have a React.js app, I built this simple meme generator app trying to learn web development (pretty new to the stuff) and am trying to host it using Github pages. I followed all the steps like installing the gh-pages with node and adding the url to the packages.json and adding the extra 2 lines of code for predeploy and deploy. I have the source for the github pages set to gh-pages. i get no errors when I run the command "npm run deploy" in terminal. But when I click the link I get a white screen. The console gives the error "Loading failed for the with source “https://z0onic.github.io/static/js/2.0b197680.chunk.js”. which is the first js file in the build directory. I searched pretty heavily and found other people who had a similar white screen issue but none of the answers helped. I have triple checked against these answers. Based on the error I'm getting I think its a build error but I don't know how to fix it or figure out exactly what is going wrong.
The github repository is at https://github.com/z0onic/meme-page and the link to the blank page that should be the hosted app is https://z0onic.github.io/meme-page/
when hosting locally through vs code with "npm start" command everything works fine.
Any help is appreciated I hope I'm not overlooking something silly but like I said I'm new to coding and still learning.
set the homepage in package.json to "https://<username>.github.io/<reponame>/" of course substituting things in <>
I'm currently following a tutorial on youtube on how to deploy a react app on AWS. He's using gitbash and nginx to do it. The problem is that currently I'm using a prebuilt template from themefor*st and the app they made includes next.js in it. Using this template, when I try to do "
npm run build" it does not provide me with an index.html file inside the build folder which is what the Youtube video tutorial points to, to run the front end on the AWS. I'm new to hosting a website but I think the problem lies in the /etc/nginx/sites-available/default configuration for the location. I look up answers on the internet but couldn't find anything helpful, closest so far are this documentation which I do not understand
https://nextjs.org/docs/advanced-features/static-html-export
I need help and if there are any questions regarding the file, I will try my best to explain them! Thank you
Here's the link to the youtube video I referred to above
https://www.youtube.com/watch?v=rE8mJ1OYjmM
I'm having a little problem with React App, see. My computer is a bullshit and I program in CodeSandbox. a week ago I have finished my React App that I was made in CodeSandbox and for upload it in my host I've downloaded the proyect to my pc and I open the command prompt for make a production build. I've used npm install for every dependencies and those things, ffter an hour, or so, my build was supposed to be ready so I used static-server to open it on my local internet, total. That when I was going to upload it to the host it did not work, I do not know why, but it goes blank.
Please I need help because I'm making a web for educational purposes :(
Thanks my web: http://eskoni.ezyro.com/d/ and sorry for that long history XD
I just know that my application isn't static.
I have used this github repository to build my application [https://github.com/jainishshah17/jainishshah.com][1]
It works perfect when i try on local host but I tried to deploy using AWS (Bitnami) and lots of other web hosting platforms but cant seem to find the right one working for me.
Can anyone tell me looking at the repository what would I need to host the app that I built?
Any help will be greatly appreciated.
For a simple MEAN stack App deployment, use Heroku.
Getting Started on Heroku with Node.js