score:2
i did one workaround which seems to work so i am posting it here. instead of implementing scrollmagic at the beginning of the document, i implement it later after componentdidmount is called and after i can be 100% sure that the window object exists.
here you go:
componentdidmount = () => {
if (typeof window !== 'undefined') {
import('scrollmagic').then((scrollmagic) => {
// your scrollmagic code here
let controller = new scrollmagic.controller();
// ....
});
}
}
this way the error disappears and therefore step 2 (step 2 from question) is not needed.
Source: stackoverflow.com
Related Query
- ScrollMagic loses functionality after Gatsby build
- Gatsby blog - every new post requires hard refresh after build
- WordpressHEADLESS and Gatsby: base url wrong after executing gatsby build
- Gatsby error page resources not found. Not rendering React. After Gatsby Build
- Relative path in index.html after build
- Blank page after running build on create-react-app
- React Native 0.64 won't build iOS app after updating Xcode to 12.5 and iOS to 14.5
- How to fix the white screen after build with create-react-app?
- Webpack taking ages to load page AFTER build is complete
- Configuration for create-react-app after ejecting to build a component library
- create react app Configuration file after build app
- Window is not defined after a build with Webpack
- Gatsby window not available during server side rendering build error
- The React App works during `npm start` but returns 404 after build
- Gatsby Failed Build - error "window" is not available during server side rendering
- react-router-dom BrowserRouter not working after build
- create react app cannot read environment variable after build
- How to make Mapbox load on gatsby site? Build succeeds but map not displaying, despite working in dev mode
- Build Failed - Non-Zero Exit Code Detected after 'npm build' in AWS Amplify
- webpack: custom style is missing after production build
- Automate deployment of static website files to S3 after the build
- Material UI Button loses Styling after page refresh
- "Error running command: Build script returned non-zero exit code" when deploying Gatsby JS site to Netlify
- no service-worker.js file after npm run build in react
- How do I make a react app in docker-compose? Container is exiting after build steps are complete
- How to edit .env file after build completed reactjs
- Gatsby works fine during development but throws error during build
- Material-ui layout scrambled after production build
- Why my react app fails on production build after upgrading to react 16?
- React sitemap.xml file in public directory is not showing after build
More Query from same tag
- How to pass data from one React website to another React Website
- How to solve node.JS passport oauth2 cors error
- Subscriptions with react-meteor-data
- Get "Recurrence" from Google Calendar API Event (React, Javascript)
- Loop through array of objects and return object keys
- Using onClick function on a styled-components button doesn't change state until the second click (added sandbox URL)
- How to create stateless functional components that accept generics?
- How to keep state property's value beyond component's parent updates with react hooks?
- How do I set a variable to value using React-Redux on the initial page load?
- Event bubbling up no matter what I try to do to stop it in a React app
- Setting State From File Contents
- React useEffect warning in MERN App: Can't perform a React state update on an unmounted component
- Problem using a prop in functional component IT Says TypeError: onClick is not a function
- React: "this" is undefined inside a component function
- Jwt expiration control and redirect login page
- Re-render only specific element which is generated by a loop
- Maximum update depth exceeded error in react app
- How to send a jpg image to the server with react-camera?
- React not rendering correctly layout after redirect
- Upgrading material-ui v3 to v4 causes redux form Field component error 'invalid prop component'
- Video not playing on mobile using React
- i have two components{addressone},{addresstwo} and want to add and delete {addresstwo} on button click inside {addressone} component
- State not updating with react redux thunk
- how to use dispatch in a right way?
- React.js: Refs are not available on initial render
- react-bootstrap how to collapse menu when item is selected
- Normalize date to DD/MM/YYYY - redux form
- My prevProps and current props in componentDidUpdate are coming same, while I am updating the state
- React - nextjs Calling custom hook in useEffect
- Setting a Unique Key for my Cards so that I can click a button and delete them in ReactJS