{"action":"closed","issue":{"url":"https://api.github.com/repos/gatsbyjs/gatsby/issues/10435","repository_url":"https://api.github.com/repos/gatsbyjs/gatsby","labels_url":"https://api.github.com/repos/gatsbyjs/gatsby/issues/10435/labels{/name}","comments_url":"https://api.github.com/repos/gatsbyjs/gatsby/issues/10435/comments","events_url":"https://api.github.com/repos/gatsbyjs/gatsby/issues/10435/events","html_url":"https://github.com/gatsbyjs/gatsby/issues/10435","id":390272324,"node_id":"MDU6SXNzdWUzOTAyNzIzMjQ=","number":10435,"title":"How to use intersection-observer polyfill in gatsby v2","user":{"login":"arturhenryy","id":45144968,"node_id":"MDQ6VXNlcjQ1MTQ0OTY4","avatar_url":"https://avatars2.githubusercontent.com/u/45144968?v=4","gravatar_id":"","url":"https://api.github.com/users/arturhenryy","html_url":"https://github.com/arturhenryy","followers_url":"https://api.github.com/users/arturhenryy/followers","following_url":"https://api.github.com/users/arturhenryy/following{/other_user}","gists_url":"https://api.github.com/users/arturhenryy/gists{/gist_id}","starred_url":"https://api.github.com/users/arturhenryy/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/arturhenryy/subscriptions","organizations_url":"https://api.github.com/users/arturhenryy/orgs","repos_url":"https://api.github.com/users/arturhenryy/repos","events_url":"https://api.github.com/users/arturhenryy/events{/privacy}","received_events_url":"https://api.github.com/users/arturhenryy/received_events","type":"User","site_admin":false},"labels":[{"id":214544677,"node_id":"MDU6TGFiZWwyMTQ1NDQ2Nzc=","url":"https://api.github.com/repos/gatsbyjs/gatsby/labels/type:%20question%20or%20discussion","name":"type: question or discussion","color":"d4c5f9","default":false}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2018-12-12T15:17:16Z","updated_at":"2018-12-12T16:51:06Z","closed_at":"2018-12-12T16:51:06Z","author_association":"NONE","body":"## Summary\r\n\r\ni have to use the intersection-observer polyfill in gatsby v2 and i dont know how to import it correctly. i am already using the a Provider in the gatsby-browser.js so i cannot use require here because otherwise webpack fails bundling because of mixed import / require. \r\n\r\ngatsby-browser.js\r\n\r\n```\r\nimport React from \"react\";\r\nimport { Provider } from \"react-redux\";\r\nimport createStore from \"./src/store/createStore\";\r\n\r\nexport const wrapRootElement = ({ element }) => {\r\n  const store = createStore();\r\n  const ConnectedRootElement = <Provider store={store}>{element}</Provider>;\r\n  return ConnectedRootElement;\r\n};\r\n```\r\n\r\nsuggested way to import the polyfill\r\n\r\n```\r\nexports.onClientEntry = () => {\r\n  // IntersectionObserver polyfill for gatsby-image (Safari, IE)\r\n  if (typeof window.IntersectionObserver === `undefined`) {\r\n    import(`intersection-observer`)\r\n    console.log(`👍 IntersectionObserver is polyfilled`)\r\n  }\r\n\r\n  // Object-fit/Object-position polyfill for gatsby-image (IE)\r\n  const testImg = document.createElement(`img`)\r\n  if (\r\n    typeof testImg.style.objectFit === `undefined` ||\r\n    typeof testImg.style.objectPosition === `undefined`\r\n  ) {\r\n    import(`object-fit-images`)()\r\n    console.log(`👍 Object-fit/Object-position are polyfilled`)\r\n  }\r\n}\r\n```\r\n\r\n"}}
{"actor":{"display_login":"arturhenryy"}}