Site Deployed but index page disappears

I was able to deploy my site without any issues but when I go to the site itself the index appears for a split second then disappears. So its not that I didn’t include the directory for the index. I thought it was a JavaScript issue but when I turned it off the html for ‘your need javascript to run this’ shows up telling me it works. I’ve looked into other pages and they seem to appear fine, its just the index page that’s doing this.

Site link: https://gtkfrontend.netlify.app

Here’s the console

10:18:26 AM: Build ready to start
10:18:27 AM: build-image version: 0e2f4c52031ab562db66aec633308326e3b108d0 (focal)
10:18:27 AM: build-image tag: focal
10:18:27 AM: buildbot version: 667117c26805e29113bede4ca1afe54070a4e3b1
10:18:28 AM: Building without cache
10:18:28 AM: Starting to prepare the repo for build
10:18:28 AM: No cached dependencies found. Cloning fresh repo
10:18:28 AM: git clone https://github.com/paolarod1/kcm-fulfillment-services-frontend
10:18:29 AM: Preparing Git Reference refs/heads/main
10:18:29 AM: Parsing package.json dependencies
10:18:31 AM: Starting build script
10:18:31 AM: Installing dependencies
10:18:31 AM: Python version set to 2.7
10:18:32 AM: Downloading and installing node v16.16.0...
10:18:32 AM: Downloading https://nodejs.org/dist/v16.16.0/node-v16.16.0-linux-x64.tar.xz...
10:18:32 AM: Computing checksum with sha256sum
10:18:32 AM: Checksums matched!
10:18:35 AM: Now using node v16.16.0 (npm v8.11.0)
10:18:35 AM: Started restoring cached build plugins
10:18:35 AM: Finished restoring cached build plugins
10:18:35 AM: Attempting ruby version 2.7.2, read from environment
10:18:36 AM: Using ruby version 2.7.2
10:18:36 AM: Using PHP version 8.0
10:18:37 AM: No npm workspaces detected
10:18:37 AM: Started restoring cached node modules
10:18:37 AM: Finished restoring cached node modules
10:18:37 AM: Installing NPM modules using NPM version 8.11.0
10:18:37 AM: npm WARN config tmp This setting is no longer used.  npm stores temporary files in a special
10:18:37 AM: npm WARN config location in the cache, and they are managed by
10:18:37 AM: npm WARN config     [`cacache`](http://npm.im/cacache).
10:18:38 AM: npm WARN config tmp This setting is no longer used.  npm stores temporary files in a special
10:18:38 AM: npm WARN config location in the cache, and they are managed by
10:18:38 AM: npm WARN config     [`cacache`](http://npm.im/cacache).
10:18:48 AM: npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
10:18:58 AM: npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
10:19:05 AM: added 1429 packages, and audited 1430 packages in 28s
10:19:05 AM: 175 packages are looking for funding
10:19:05 AM:   run `npm fund` for details
10:19:05 AM: 8 vulnerabilities (1 moderate, 6 high, 1 critical)
10:19:05 AM: To address issues that do not require attention, run:
10:19:05 AM:   npm audit fix
10:19:05 AM: To address all issues (including breaking changes), run:
10:19:05 AM:   npm audit fix --force
10:19:05 AM: Run `npm audit` for details.
10:19:05 AM: NPM modules installed
10:19:06 AM: npm WARN config tmp This setting is no longer used.  npm stores temporary files in a special
10:19:06 AM: npm WARN config location in the cache, and they are managed by
10:19:06 AM: npm WARN config     [`cacache`](http://npm.im/cacache).
10:19:06 AM: Started restoring cached go cache
10:19:06 AM: Finished restoring cached go cache
10:19:06 AM: Installing Go version 1.17 (requested 1.17)
10:19:11 AM: unset GOOS;
10:19:11 AM: unset GOARCH;
10:19:11 AM: export GOROOT='/opt/buildhome/.gimme/versions/go1.17.linux.amd64';
10:19:11 AM: export PATH="/opt/buildhome/.gimme/versions/go1.17.linux.amd64/bin:${PATH}";
10:19:11 AM: go version >&2;
10:19:11 AM: export GIMME_ENV="/opt/buildhome/.gimme/env/go1.17.linux.amd64.env"
10:19:11 AM: go version go1.17 linux/amd64
10:19:11 AM: Installing missing commands
10:19:11 AM: Verify run directory
10:19:13 AM: ​
10:19:13 AM: ────────────────────────────────────────────────────────────────
10:19:13 AM:   Netlify Build                                                 
10:19:13 AM: ────────────────────────────────────────────────────────────────
10:19:13 AM: ​
10:19:13 AM: ❯ Version
10:19:13 AM:   @netlify/build 27.4.2
10:19:13 AM: ​
10:19:13 AM: ❯ Flags
10:19:13 AM:   baseRelDir: true
10:19:13 AM:   buildId: 62d80eb2b335a15f83f85c54
10:19:13 AM:   deployId: 62d80eb2b335a15f83f85c56
10:19:13 AM: ​
10:19:13 AM: ❯ Current directory
10:19:13 AM:   /opt/build/repo
10:19:13 AM: ​
10:19:13 AM: ❯ Config file
10:19:13 AM:   No config file was defined: using default values.
10:19:13 AM: ​
10:19:13 AM: ❯ Context
10:19:13 AM:   production
10:19:13 AM: ​
10:19:13 AM: ────────────────────────────────────────────────────────────────
10:19:13 AM:   1. Build command from Netlify app                             
10:19:13 AM: ────────────────────────────────────────────────────────────────
10:19:13 AM: ​
10:19:13 AM: $ CI= npm run build
10:19:13 AM: npm WARN config tmp This setting is no longer used.  npm stores temporary files in a special
10:19:13 AM: npm WARN config location in the cache, and they are managed by
10:19:13 AM: npm WARN config     [`cacache`](http://npm.im/cacache).
10:19:13 AM: > kcm-proving-ground-frontend@1.0.0 build
10:19:13 AM: > set \"GENERATE_SOURCEMAP=false\" && CI= react-scripts build
10:19:14 AM: Creating an optimized production build...
10:19:43 AM: Compiled with warnings.
10:19:43 AM: 
10:19:43 AM: src/App.js
10:19:43 AM:   Line 50:8:  React Hook useEffect has a missing dependency: 'updateUserInfo'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/CreateServiceModal.js
10:19:43 AM:   Line 88:8:  React Hook useCallback has missing dependencies: 'active' and 'toggleToastActive'. Either include them or remove the dependency array. You can also do a functional update 'setActive(a => ...)' if you only need 'active' in the 'setActive' call  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/CreateUserModal.js
10:19:43 AM:   Line 61:8:  React Hook useCallback has missing dependencies: 'shopifyGQLId', 'toggleToastActive', and 'usertype'. Either include them or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/DeleteServiceModal.js
10:19:43 AM:   Line 89:8:  React Hook useCallback has a missing dependency: 'props'. Either include it or remove the dependency array. However, 'props' will change when *any* prop changes, so the preferred fix is to destructure the 'props' object outside of the useCallback call and refer to those specific props inside useCallback  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/DeleteUserModal.js
10:19:43 AM:   Line 60:8:  React Hook useCallback has a missing dependency: 'toggleToastActive'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/RevokeInvitationModel.js
10:19:43 AM:   Line 60:8:  React Hook useCallback has a missing dependency: 'toggleToastActive'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/accountManagement/AccountInfo.js
10:19:43 AM:   Line 27:8:  React Hook useEffect has a missing dependency: 'updateUserInfo'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/accountManagement/AccountInvitations.js
10:19:43 AM:   Line 28:119:  'shopifyGQLId' is assigned a value but never used  no-unused-vars
10:19:43 AM: src/components/pages/views/shared/accountManagement/FulfillmentServices/FulfillmentServices.js
10:19:43 AM:   Line 26:16:  'admin_graphql_api_id' is assigned a value but never used                                                                                                                                                                                                                                                                                                                 no-unused-vars
10:19:43 AM:   Line 32:53:  The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md  jsx-a11y/anchor-is-valid
10:19:43 AM: src/components/pages/views/shared/accountManagement/FulfillmentServices/ManageFulfillmentService.js
10:19:43 AM:   Line 116:8:  React Hook useCallback has a missing dependency: 'location.state'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/AdminView/FulfillmentServicesNavigation.js
10:19:43 AM:   Line 53:57:  The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md  jsx-a11y/anchor-is-valid
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/AdminView/Orders/AssignedFulfillmentOrders.js
10:19:43 AM:   Line 40:65:  'merchantRequests' is assigned a value but never used                                                                                                                                                                                                                                                                                                                     no-unused-vars
10:19:43 AM:   Line 67:57:  The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md  jsx-a11y/anchor-is-valid
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/AdminView/UnmanagedServices.js
10:19:43 AM:   Line 53:57:  The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md  jsx-a11y/anchor-is-valid
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/FulfillmentMemberView/orderFulfillment/ViewAllFulfillmentsRequested.js
10:19:43 AM:   Line 2:5:    'Frame' is defined but never used                                                                                                                                                                                                                                                                                                                                         no-unused-vars
10:19:43 AM:   Line 53:8:   React Hook useEffect has a missing dependency: 'serviceLocationId'. Either include it or remove the dependency array                                                                                                                                                                                                                                                      react-hooks/exhaustive-deps
10:19:43 AM:   Line 57:65:  'merchantRequests' is assigned a value but never used                                                                                                                                                                                                                                                                                                                     no-unused-vars
10:19:43 AM:   Line 83:57:  The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md  jsx-a11y/anchor-is-valid
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/FulfillmentMemberView/orderFulfillment/modals/CancelFulfillmentOrderModal.js
10:19:43 AM:   Line 38:9:  'navigate' is assigned a value but never used  no-unused-vars
10:19:43 AM: src/components/pages/views/shared/fulfillmentOrders/FulfillmentMemberView/orderFulfillment/modals/RejectFulfillmentOrderRequestModal.js
10:19:43 AM:   Line 78:8:  React Hook useCallback has a missing dependency: 'props'. Either include it or remove the dependency array. However, 'props' will change when *any* prop changes, so the preferred fix is to destructure the 'props' object outside of the useCallback call and refer to those specific props inside useCallback  react-hooks/exhaustive-deps
10:19:43 AM: Search for the keywords to learn more about each warning.
10:19:43 AM: To ignore, add // eslint-disable-next-line to the line before.
10:19:43 AM: File sizes after gzip:
10:19:43 AM:   178.02 kB  build/static/js/main.6625139d.js
10:19:43 AM:   35.24 kB   build/static/css/main.b7048970.css
10:19:43 AM:   1.8 kB     build/static/js/787.36079cde.chunk.js
10:19:43 AM: The project was built assuming it is hosted at /.
10:19:43 AM: You can control this with the homepage field in your package.json.
10:19:43 AM: The build folder is ready to be deployed.
10:19:43 AM: You may serve it with a static server:
10:19:43 AM:   npm install -g serve
10:19:43 AM:   serve -s build
10:19:43 AM: Find out more about deployment here:
10:19:43 AM:   https://cra.link/deployment
10:19:44 AM: ​
10:19:44 AM: (build.command completed in 30.9s)
10:19:44 AM: ​
10:19:44 AM: ────────────────────────────────────────────────────────────────
10:19:44 AM:   2. Deploy site                                                
10:19:44 AM: ────────────────────────────────────────────────────────────────
10:19:44 AM: ​
10:19:44 AM: Starting to deploy site from 'build'
10:19:44 AM: Creating deploy tree 
10:19:44 AM: Creating deploy upload records
10:19:44 AM: 0 new files to upload
10:19:44 AM: 0 new functions to upload
10:19:44 AM: Site deploy was successfully initiated
10:19:44 AM: ​
10:19:44 AM: (Deploy site completed in 285ms)
10:19:44 AM: ​
10:19:44 AM: ────────────────────────────────────────────────────────────────
10:19:44 AM:   Netlify Build Complete                                        
10:19:44 AM: ────────────────────────────────────────────────────────────────
10:19:44 AM: ​
10:19:44 AM: (Netlify Build completed in 31.2s)
10:19:44 AM: Starting post processing
10:19:44 AM: Skipping HTML post processing
10:19:44 AM: Caching artifacts
10:19:44 AM: Started saving node modules
10:19:44 AM: Finished saving node modules
10:19:44 AM: Started saving build plugins
10:19:44 AM: Finished saving build plugins
10:19:44 AM: Started saving pip cache
10:19:44 AM: Post processing - header rules
10:19:44 AM: Finished saving pip cache
10:19:44 AM: Started saving emacs cask dependencies
10:19:44 AM: Post processing - redirect rules
10:19:44 AM: Finished saving emacs cask dependencies
10:19:44 AM: Started saving maven dependencies
10:19:44 AM: Finished saving maven dependencies
10:19:44 AM: Started saving boot dependencies
10:19:44 AM: Finished saving boot dependencies
10:19:44 AM: Started saving rust rustup cache
10:19:44 AM: Finished saving rust rustup cache
10:19:44 AM: Started saving go dependencies
10:19:44 AM: Finished saving go dependencies
10:19:44 AM: Post processing done
10:19:46 AM: Build script success
10:19:47 AM: Site is live ✨
10:19:49 AM: Uploading Cache of size 137.1MB
10:19:50 AM: Finished processing build request in 1m22.101052084s

@paolarod1 This doesn’t appear to be a Netlify issue, but simply something odd with your site.

How does it behave when you run it locally?

It looks like it immediately tries to load https://gtkfrontend.netlify.app/user/info which shows as a 404 page, but returns a 200 status.

locally, it appears just as it supposed to.

How can I change it so it loads the index file instead of /user/info?

@paolarod1 It does load the /index.html file

Something in your app then requests that other page

I can’t advise, as it’s all compiled code.

If you can post a link to a public repo someone may be able to assist.

I pushed new code to my connected GitHub and now it seems to be working fine.

1 Like

Thanks for coming back and sharing this! Glad you found a solution and got unblocked!