Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove environment warning #59

Open
guyhamilton opened this issue Sep 10, 2020 · 4 comments
Open

Remove environment warning #59

guyhamilton opened this issue Sep 10, 2020 · 4 comments

Comments

@guyhamilton
Copy link

Hi, first of all - great plugin!

I've set it up and everything works great, but when I run gulp I get the warning "basicScroll is not executing because you are using it in an environment without a window object".

I'm a bit of a rookie so this could be something I have done. I've searched the error and similar errors on Google but couldn't find a fix. Any ideas?

@electerious electerious changed the title Warning: environment without a window object Remove environment warning Sep 11, 2020
@electerious
Copy link
Owner

That's fine. It's because you're building or using your modules in an environment without a window object. You can ignore it if your site is working fine 😊

We should remove this error as it's just annoying when using SSR.

@guyhamilton
Copy link
Author

@electerious Ok cheers - thanks for your response!

@juriadams
Copy link

What's if the site isn't working fine? 😞

This might be a problem related to the react-basic-scroll package, but when trying to use a variable, it's initially set to NaN and when scrolling just 1px, it sets itself to the to value. I'm pretty sure this is related to this warning message.

Here's my config:

public config: any = {
    from: "bottom-bottom",
    to: "top-top",
    direct: true,
    props: {
        "--r": {
            from: "0",
            to: "0.1turn",
        },
    },
};

And here's my implementation of the ReactBasicScroll Wrapper-Component:

<ReactBasicScroll config={this.config}>
    <div className={styles.opener}>
        <div className={styles.wrapper}>
            <div className={styles.content} style={{ transform: "rotate(var(--r))" }}>
                ...
            </div>
        </div>
    </div>
</ReactBasicScroll>

When initially opening the Page, the variable is set to NaNturn:

... and after scrolling 1px, it sets itself to 0.1turn, the to value:

Do you want me to open a new Issue? I'm not sure since I suspect that this relates to this issue. :)

@electerious
Copy link
Owner

It's not related to this issue, but it might be worth to try from: 0 instead of from: "0". Not sure if that helps. It might also be because of the from and to values. You're currently starting your animation when the bottom of the element reaches the bottom of the viewport, and ending when the top of the element reaches the top of the viewport. This should be fine, but it might be worth to try different values.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants