WebpackError: ReferenceError: window is not defined - npm run build

Question

I get the following error when i do "npm run build" :

WebpackError: ReferenceError: window is not defined

this is a part of code that causes an error:

    params.slidesPerView =  Math.floor(window.innerWidth/400);
    // params.slidesPerGroup = Math.floor(window.innerWidth/400);
    console.log("Calc Width");
    console.log(window.innerWidth/400);
    this.lastWidth = params.slidesPerView;

Mohammadreza Khedri · Accepted Answer · 2019-06-25 15:23:04Z

2

During your development, you can access to window in client. When you run build, gatsby renders these components on the server where window is not defined.

Solution is the use window in componentDidMount or check window before you want use it.

answered Jun 25, 2019 at 15:23

Mohammadreza Khedri

2,7392 gold badges13 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

tbone Over a year ago

"componentDidMount" How to use it ?

Mohammadreza Khedri Over a year ago

See this link: gatsbyjs.org/docs/debugging-html-builds/…

Mohammadreza Khedri Over a year ago

Read number 1 in above link in gatsby documention.

Collectives™ on Stack Overflow

WebpackError: ReferenceError: window is not defined - npm run build

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related