私はここで同じ問題を経験しています、Coverflowはgatsby開発では正常に動作しますが、ビルドではエラーをスローします：WebpackError：ウィンドウが定義されていません
WebpackError：ウィンドウが定義されていません
- react-coverflow.js:1 Object.<anonymous>
~/react-coverflow/dist/react-coverflow.js:1:330
- main.js:1 Object.<anonymous>
~/react-coverflow/main.js:1:1
このライブラリ「Coverflow」が原因だと思います
import Coverflow from 'react-coverflow';
import { StyleRoot } from 'radium'
class Team extends React.Component {
render(){
return(
<StyleRoot>
<Coverflow
displayQuantityOfSide={2}
navigation
infiniteScroll
enableHeading
active={0}
media={{
'@media (max-width: 720px)': {
width: '100%',
height: '200px'
},
'@media (min-width: 720px)': {
width: '100%',
height: '400px',
}
}}
>
<img src={Sandiso} alt='Chairperson'/>
<img src={Sihle} alt='Deputy Chairperson' />
<img src={olwethu} alt='General Secretary' />
<img src={Aphiwe} alt='Recording Secretary'/>
<img src={cynoh} alt='Treasury'/>
<img src={aso} alt='Marketing' />
</Coverflow>
</StyleRoot>
)
}
}
export default Team;
React.LazyとSuspenseに関する他の提案された回答を完全には調べていませんが、Intersection Observerをインスタンス化しようとして同様の問題に遭遇し、この問題に対するKyleMatthewの応答でより簡単な回答を見つけました。
https://github.com/gatsbyjs/gatsby/issues/309#issuecomment-223360361
つまり、潜在的に、あなたはあなたのパッケージまたは何を探しているインポートすることができますwindowにcomponentDidMountする方法（またはuseEffectコンポーネントのフックを）。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加