I successfully deployed my website to Netlify, but I’ve encountered an issue with the button function on the first page. It seems to be working fine on localhost and the production website, but on Netlify, it’s not functioning properly and throwing an error.
I’m wondering if there’s any setting I might have missed during the deployment to Netlify. I’m a bit hesitant about transitioning from Heroku to Netlify because of the current issues I’m facing, and I’m concerned that additional issues might arise.
• Website on Netlify: https://stonewell.netlify.app/
• Production website in Heroku: https://www.stonewellfinancial.com/
Error: Uncaught TypeError: Cannot read properties of null (reading ‘scrollTop’)
at floatbutton1_c129acce0004cf020d779f7822c043b0_.js:1:115
at floatbutton1_c129acce0004cf020d779f7822c043b0_.js:1:19820
Recent build log:
4:09:27 PM: Netlify Build
4:09:27 PM: ────────────────────────────────────────────────────────────────
4:09:27 PM:
4:09:27 PM: ❯ Version
4:09:27 PM: @netlify/build 29.11.6
4:09:27 PM:
4:09:27 PM: ❯ Flags
4:09:27 PM: baseRelDir: true
4:09:27 PM: buildId: 647657cf6b58040c8e3b160d
4:09:27 PM: deployId: 647657cf6b58040c8e3b160f
4:09:27 PM:
4:09:27 PM: ❯ Current directory
4:09:27 PM: /opt/build/repo/client
4:09:27 PM:
4:09:27 PM: ❯ Config file
4:09:27 PM: /opt/build/repo/netlify.toml
4:09:27 PM:
4:09:27 PM: ❯ Context
4:09:27 PM: production
4:09:27 PM:
4:09:27 PM: build.command from netlify.toml
4:09:27 PM: ────────────────────────────────────────────────────────────────
4:09:27 PM:
4:09:27 PM: $ npm run build
4:09:27 PM: > client@0.1.0 build /opt/build/repo/client
4:09:27 PM: > react-scripts build
4:09:28 PM: Creating an optimized production build…
4:09:29 PM: Browserslist: caniuse-lite is outdated. Please run:
4:09:29 PM: npx browserslist@latest --update-db
4:09:29 PM: Why you should do it regularly: GitHub - browserslist/browserslist: 🦔 Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env
4:10:21 PM: Compiled successfully.
4:10:21 PM:
4:10:21 PM: File sizes after gzip:
4:10:21 PM: 909.69 KB build/static/js/main.9de56f40.chunk.js
4:10:21 PM: 573.64 KB build/static/js/2.8da40ebb.chunk.js
4:10:21 PM: 5.44 KB build/static/css/2.6caa8e7f.chunk.css
4:10:21 PM: 1.22 KB build/static/css/main.c571d416.chunk.css
4:10:21 PM: 772 B build/static/js/runtime-main.a9f80a17.js
4:10:21 PM: The bundle size is significantly larger than recommended.
4:10:21 PM: Consider reducing it with code splitting: https://goo.gl/9VhYWB
4:10:21 PM: You can also analyze the project dependencies: https://goo.gl/LeUzfb
4:10:21 PM: The project was built assuming it is hosted at /.
4:10:21 PM: You can control this with the homepage field in your package.json.
4:10:21 PM: The build folder is ready to be deployed.
4:10:21 PM: You may serve it with a static server:
4:10:21 PM: yarn global add serve
4:10:21 PM: serve -s build
4:10:21 PM: Find out more about deployment here:
4:10:21 PM: Deployment | Create React App
4:10:22 PM: > client@0.1.0 postbuild /opt/build/repo/client
4:10:22 PM: > react-hydratable
4:10:22 PM: react-hydratable: Config build…
4:10:22 PM: react-hydratable: Config is here
4:10:22 PM: {
4:10:22 PM: webroot: ‘/opt/build/repo/client/build’,
4:10:22 PM: host: ‘http://localhost’,
4:10:22 PM: port: 3000,
4:10:22 PM: crawlingUrls: [
4:10:22 PM: ‘/’,
4:10:22 PM: ‘/ko’,
4:10:22 PM: ‘/ar’,
4:10:22 PM: ‘/ch_s’,
4:10:22 PM: ‘/ch_t’,
4:10:22 PM: ‘/de’,
4:10:22 PM: ‘/es’,
4:10:22 PM: ‘/fa’,
4:10:22 PM: ‘/fr’,
4:10:22 PM: ‘/ja’,
4:10:22 PM: ‘/pt_br’,
4:10:22 PM: ‘/yue’,
4:10:22 PM: ‘/travel-insurance’,
4:10:22 PM: ‘/travel-insurance/ko’,
4:10:22 PM: ‘/travel-insurance/ar’,
4:10:22 PM: ‘/travel-insurance/ch_s’,
4:10:22 PM: ‘/travel-insurance/ch_t’,
4:10:22 PM: ‘/travel-insurance/de’,
4:10:22 PM: ‘/travel-insurance/es’,
4:10:22 PM: ‘/travel-insurance/fa’,
4:10:22 PM: ‘/travel-insurance/fr’,
4:10:22 PM: ‘/travel-insurance/ja’,
4:10:22 PM: ‘/travel-insurance/pt_br’,
4:10:22 PM: ‘/travel-insurance/yue’,
4:10:22 PM: ‘/travel-insurance/student’,
4:10:22 PM: ‘/travel-insurance/student/ko’,
4:10:22 PM: ‘/travel-insurance/student/ar’,
4:10:22 PM: ‘/travel-insurance/student/ch_s’,
4:10:22 PM: ‘/travel-insurance/student/ch_t’,
4:10:22 PM: ‘/travel-insurance/student/de’,
4:10:22 PM: ‘/travel-insurance/student/es’,
4:10:22 PM: ‘/travel-insurance/student/fa’,
4:10:22 PM: ‘/travel-insurance/student/fr’,
4:10:22 PM: ‘/travel-insurance/student/ja’,
4:10:22 PM: ‘/travel-insurance/student/pt_br’,
4:10:22 PM: ‘/travel-insurance/student/yue’,
4:10:22 PM: ‘/travel-insurance/visitor’,
4:10:22 PM: ‘/travel-insurance/visitor/ko’,
4:10:22 PM: ‘/travel-insurance/visitor/ar’,
4:10:22 PM: ‘/travel-insurance/visitor/ch_s’,
4:10:22 PM: ‘/travel-insurance/visitor/ch_t’,
4:10:22 PM: ‘/travel-insurance/visitor/de’,
4:10:22 PM: ‘/travel-insurance/visitor/es’,
4:10:22 PM: ‘/travel-insurance/visitor/fa’,
4:10:22 PM: ‘/travel-insurance/visitor/fr’,
4:10:22 PM: ‘/travel-insurance/visitor/ja’,
4:10:22 PM: ‘/travel-insurance/visitor/pt_br’,
4:10:22 PM: ‘/travel-insurance/student/yue’
4:10:22 PM: ],
4:10:22 PM: delay: 1500,
4:10:22 PM: userAgent: ‘react-hydratable’,
4:10:22 PM: htmlPrefix: ‘’
4:10:22 PM: }
4:10:22 PM: createHttpServer: server is started
4:10:22 PM: createHttpServer: ready (PORT 3000)
4:10:22 PM: Crawling: start
…
4:12:01 PM: Crawling: end
4:12:01 PM: createHttpServer: server is closed
4:12:01 PM: Crawling: [OK] http://localhost:3000/travel-insurance/student/yue
4:12:01 PM:
4:12:01 PM: (build.command completed in 2m 34s)
4:12:01 PM:
4:12:02 PM: (Netlify Build completed in 2m 34.9s)
4:12:07 PM: Section completed: building
4:12:15 PM: Finished processing build request in 3m25.667s