tgczan Posted April 4, 2023 Share Posted April 4, 2023 I have used several GSAP plugins now with no problems. Yet, SplitText continues to be undefined somehow. I've tried all the obvious solutions: - checking basic typos/mispellings - copied code directly from the Doc - loaded GSAP js files as local files - called said files in <script> in index.html - <script> lines follow order of gsap.min.js -> [plugin].js -> script.js Other plugins (like ScrambleText, for example), have worked just fine with this setup. SplitText is the only one throwing up this basic error. What am I missing? I have made a replication of the problem here: [deleted] You'll see that the page loads and will scramble the text as expected. If you uncomment the SplitText line (line 10), you'll see the undefined error in the console. As you can see, both ScrambleTextPlugin.min.js and SplitText.min.js are located in the same folder and are declared in index.html at the same time. Why are they behaving differently? Link to comment Share on other sites More sharing options...
Solution GreenSock Posted April 4, 2023 Solution Share Posted April 4, 2023 It looks like that's a problem with the playcode.io environment - if you console.log(this) in the SplitText or ScrambleTextPlugin file, you'll see that it's a module rather than the window object itself. If you just try running the same HTML/JS outside the playcode.io environment, you'll see that "this" refers to the window. That's what SplitText gets defined on, like this.SplitText = SplitText. So in the playcode.io environment, that's not the window, thus you can't reference it globally. It looks like in the playcode.io environment, you can load it as if it's a module instead, like: import {SplitText} from "../src/SplitText.min.js"; The only reason ScrambleTextPlugin appeared to work is because when it loads, it checks to see if gsap is defined globally and if so, it'll call gsap.registerPlugin() to register itself automatically. You were never actually referencing ScrambleTextPlugin anywhere in your code - if you tried, you'd see exactly the same error. Side note: I deleted the link in your post because you were basically giving the whole world free access to members-only plugins 😯 1 Link to comment Share on other sites More sharing options...
tgczan Posted April 5, 2023 Author Share Posted April 5, 2023 Really appreciate the explanation. I was blindly guessing at solutions and got quite close, but unfortunately not close enough. Thank you for the help. 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now