Hello, I have a static site made with Gatsby and WP for the backend. I have the same git deployed on Netlify and it works great. When it comes to deploy it on any Ubuntu like server i have always the same problem. Here is what I have done:
- Made an Ubuntu Droplet
- Installed nginx
- Installed npm
- Intalled node
- Cloned the repo in /var/www
- Made a production build with “gatsby build” after npm install The build give me success. if I point to: http://46.101.101.149/filipporivolta.it-gatsby/public/ where the build is living for testing purposes, images and js are not loaded. The same repo built on netlify works great: https://www.filipporivolta.online
I have the same problem on all environments. What am I missing?
Thanks a lot, F.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
Hey F.
It looks like your images and JS are not loaded because of relative URL issues:
- The nginx document root is
/var/www- _so when someone loadshttp://46.101.101.149nginx looks for files in/var/www - Your site is two directories down, at:
/var/www/filipporivolta.it-gatsby/public/so you correctly had to add/filipporivolta.it-gatsby/public/to the external URL to get to your Gatsby public root. - However, Gatsby doesn’t know about those two subdirectories, and renders out links to JS and Images like this:
<script src="/1-b0f05c4bb642dc46906c.js" async="">^ That URL is referencing a nonexistent JS file athttp://46.101.101.149/1-b0f05c4bb642dc46906c.jsAKA/var/www/1-b0f05c4bb642dc46906c.js
To Fix: Move your nginx document root from /var/www/ to /var/www/filipporivolta.it-gatsby/public/ by updating your nginx config and reloading nginx. Instructions here: https://www.digitalocean.com/community/tutorials/how-to-move-an-nginx-web-root-to-a-new-location-on-ubuntu-16-04#step-2-—-updating-the-configuration-files
Become a contributor for community
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
DigitalOcean Documentation
Full documentation for every DigitalOcean product.
Resources for startups and SMBs
The Wave has everything you need to know about building a business, from raising funding to marketing your product.
The developer cloud
Scale up as you grow — whether you're running one virtual machine or ten thousand.
Get started for free
Sign up and get $200 in credit for your first 60 days with DigitalOcean.*
*This promotional offer applies to new accounts only.