Can't access my netlify site / netlify site won't load

maggie, I want to second what greg said below. This is the second thread we are seeing where this %PUBLIC_URL% is causing problems - unfortunately, this is something to do with the tool you are using to build the site, and not Netlify, I dont think.

Here is the other thread:

In the readme, here: it says:

Only files inside the public folder will be accessible by %PUBLIC_URL% prefix. If you need to use a file from src or node_modules, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.

When you run npm run build, Create React App will substitute %PUBLIC_URL% with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.

In JavaScript code, you can use process.env.PUBLIC_URL for similar purposes:

can you tell us the build setting you are using to run things as part of your build step (your build settings)? It seems like CRA (create react app) isn’t substituting the URL the way it is supposed to.

Hi Perry,

I used yarn build. So, how exactly do I fix it. I am a little confused. I see that I have a build folder.

can you tell me what your build settings are set to in the netlify UI?

can you also post your package.json please?

This is what it is now. I have changed it a bunch of times trying to fix it but I think this is what it was before as well.

i am not a create-react-app expert but their docs say the following:

" When you’re ready to deploy to production, create a minified bundle with npm run build ."

So that needs to be your build command. This also matches what the other readme said - that the public URL doesn’t get rendered correctly until you run npm run build. This isn’t a Netlify issue so much as getting the build commands right issue, i think.

so change yarn build to npm run build?

yep! try that and then let me know what happens. check your deploy log, and if it gives you an error, please post the full deploy log here too.

didn’t work :sob: , no error. it says page not found. here is the log:

7:09:17 PM: [WARNING] We are experiencing internal issues storing deploy logs. Some log lines may be missing.
7:09:17 PM: Build ready to start
7:09:22 PM: build-image version: 2dbd444fcdce00cf06325060a8238d5ae3e86774
7:09:22 PM: build-image tag: v3.3.7
7:09:22 PM: buildbot version: 10926ec3478dd6c0bfc84e15d24de329bb1b357f
7:09:22 PM: Fetching cached dependencies
7:09:22 PM: Starting to download cache of 129.9MB
7:09:25 PM: Finished downloading cache in 2.878083627s
7:09:25 PM: Starting to extract cache
7:09:31 PM: Finished extracting cache in 6.150566899s
7:09:31 PM: Finished fetching cache in 9.069936549s
7:09:31 PM: Starting to prepare the repo for build
7:09:32 PM: Preparing Git Reference refs/heads/master
7:09:32 PM: Starting build script
7:09:32 PM: Installing dependencies
7:09:33 PM: Started restoring cached node version
7:09:36 PM: Finished restoring cached node version
7:09:37 PM: v10.19.0 is already installed.
7:09:38 PM: Now using node v10.19.0 (npm v6.13.4)
7:09:38 PM: Attempting ruby version 2.6.2, read from environment
7:09:40 PM: Using ruby version 2.6.2
7:09:40 PM: Using PHP version 5.6
7:09:40 PM: Started restoring cached node modules
7:09:40 PM: Finished restoring cached node modules
7:09:40 PM: Started restoring cached yarn cache
7:09:40 PM: Finished restoring cached yarn cache
7:09:41 PM: Installing NPM modules using Yarn version 1.17.0
7:09:41 PM: yarn install v1.17.0
7:09:42 PM: [1/4] Resolving packages...
7:09:42 PM: success Already up-to-date.
7:09:42 PM: Done in 0.75s.
7:09:42 PM: NPM modules installed using Yarn
7:09:42 PM: Started restoring cached go cache
7:09:42 PM: Finished restoring cached go cache
7:09:42 PM: unset GOOS;
7:09:42 PM: unset GOARCH;
7:09:42 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.12.linux.amd64';
7:09:42 PM: export PATH="/opt/buildhome/.gimme/versions/go1.12.linux.amd64/bin:${PATH}";
7:09:42 PM: go version >&2;
7:09:42 PM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.12.linux.amd64.env';
7:09:42 PM: go version go1.12 linux/amd64
7:09:42 PM: Installing missing commands
7:09:42 PM: Verify run directory
7:09:43 PM: Executing user command: npm run build
7:09:43 PM: > front-end@0.1.0 build /opt/build/repo
7:09:43 PM: > react-scripts build
7:09:45 PM: Creating an optimized production build...
7:10:05 PM: Compiled with warnings.
7:10:05 PM: ./src/components/Projects.js
7:10:05 PM:   Line 3:  'Button' is defined but never used  no-unused-vars
7:10:05 PM: Search for the keywords to learn more about each warning.
7:10:05 PM: To ignore, add // eslint-disable-next-line to the line before.
7:10:05 PM: File sizes after gzip:
7:10:05 PM:   224.26 KB  build/static/js/main.943edfe0.js
7:10:05 PM:   528 B      build/static/css/main.2e849cee.css
7:10:05 PM: The project was built assuming it is hosted at the server root.
7:10:05 PM: You can control this with the homepage field in your package.json.
7:10:05 PM: For example, add this to build it for GitHub Pages:
7:10:05 PM:   "homepage" : "",
7:10:05 PM: The build folder is ready to be deployed.
7:10:05 PM: You may serve it with a static server:
7:10:05 PM:   yarn global add serve
7:10:05 PM:   serve -s build
7:10:05 PM: Find out more about deployment here:
7:10:05 PM:
7:10:05 PM: Skipping functions preparation step: no functions directory set
7:10:05 PM: Caching artifacts
7:10:05 PM: Started saving node modules
7:10:05 PM: Finished saving node modules
7:10:05 PM: Started saving yarn cache
7:10:05 PM: Finished saving yarn cache
7:10:05 PM: Started saving pip cache
7:10:05 PM: Finished saving pip cache
7:10:05 PM: Started saving emacs cask dependencies
7:10:05 PM: Finished saving emacs cask dependencies
7:10:05 PM: Started saving maven dependencies
7:10:05 PM: Finished saving maven dependencies
7:10:05 PM: Started saving boot dependencies
7:10:05 PM: Finished saving boot dependencies
7:10:05 PM: Started saving go dependencies
7:10:05 PM: Finished saving go dependencies
7:10:05 PM: Build script success
7:10:05 PM: Starting to deploy site from ''
7:10:05 PM: Creating deploy tree 
7:10:05 PM: Creating deploy upload records
7:10:06 PM: 0 new files to upload
7:10:06 PM: 0 new functions to upload
7:10:06 PM: Starting post processing
7:10:06 PM: Post processing done
7:10:06 PM: Site is live
7:10:29 PM: Finished processing build request in 1m7.09749249s

a ha! this is actually not a bad thing.

I think we are actually making progress. We may still need to tweak things a little bit. Let’s keep trying!

Give this a read through - we may have the wrong directory settings to show the deployed site correctly BUT i think that npm run build is indeed the correct command to deal with the error you had earlier.

I have the index.html file and I have tried build, public, and src all to no avail. :sob:

ok. I still feel we are close to getting this working.

go ahead and follow the instructions here to download the site:

and then please post a screenshot showing your directory structure, so we can figure out exactly what is generated and why, so we can point the paths to the index.html.

looks like your publish directory should just be blank, can you try that and see if that makes the index.html show up?

still gave page not found

I’m not sure why exactly but it was react-router-dom. I had to change my app.js code to mostly match this:

then change my publish directory to /build.

1 Like

oh my goodness - after all that troubleshooting and then you figured it out yourself! :tada: :tada: :tada:

1 Like

Thank you! To be honest though, you taught me a lot about how netlify works and the production build process. Thank-you so much for your help!


awesome. i’m glad that was helpful!!

1 Like

I know this is resolved now, but just for the record, yarn build works fine too. You can use either Yarn or npm with Create React App :slight_smile: