Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Yashi-2

CSSPlugin Webpack error - Uncaught Cannot tween a null target

Recommended Posts

2 minutes ago, GreenSock said:

 

Aha! That may be the key. I wonder if either the external CSS files haven't fully loaded at that time yet or perhaps they don't contain the style you think they contain. Again, I really wish you could provide an actual reduced test case that we could see for ourselves. I'm not sure we can do much else without that. I'd bet that if you put the styles directly in the page it'd work, though I know that may not be ideal in your scenario. 

 

yes for development i want to use hot module replacement, but there is a feature call writetodisk. it will allow us to output css into a file. i just tested it, it also doesn't work. i mean file is outputting correctly but error is still there.  actually i'm thinking about how to give you guys a codepen demo. i don't know how webpack import will handle in codepen

Link to comment
Share on other sites

this is the expected behavior. but it doesn't work when i work with webpack and imports

 

See the Pen BvbGMG by yashi (@yashi) on CodePen

 

Link to comment
Share on other sites

33 minutes ago, Yashi-2 said:

this is the expected behavior. but it doesn't work when i work with webpack and imports

 

Yeah, that doesn't really help at all. We need to see the non-working version. :( 

 

Maybe try stackblitz.com? Or Codesandbox.io? 

Link to comment
Share on other sites

29 minutes ago, GreenSock said:

 

Yeah, that doesn't really help at all. We need to see the non-working version. :( 

 

Maybe try stackblitz.com? Or Codesandbox.io

 

OK, i found the issue. check this out. its bundled using parcel.js it does the same thing like webpack. i think the issue is in hot-module replacement, when we start dev or production mode. webpack write link-href tag into the file head area (invisible) but in this current situation link-href not presence in html file. production build also not presence the link-href until you build, but when i include css file directly in header area there is no issue at all.

 

to check the issue. just comment out the html link-href.

 

https://codesandbox.io/s/9l9xvz806p

Link to comment
Share on other sites

Hi again
 

The best way to get this solved faster is to create a limited reduced codepen demo using the CSSRulePlugin setup CSS, JS, and HTML. Then once you see it run correctly in codepen you will know that the issue is with your local react setup. Plus we can actually see some code with an animation to test live.

 

But without seeing your code in a live editable environment we wont be able to see whats going on to help you better.

 

 

You should also check out StackOverflow for CSS pseudo-elements and React:

 

https://stackoverflow.com/questions/28269669/css-pseudo-elements-in-react/28269950

 

Thanks! :)

 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×