importing registering scrolltrigger

[JamesGrubb]

Hello having an issue where a local build is working but the Netlify built site is showing a resource not found error. Wondered if someone could check my code please.

 

//scripts.js
gsap.registerPlugin(ScrollTrigger)
const tl = gsap.timeline()
const q = gsap.timeline({ defaults: { duration: 2 } })
const items = document.querySelectorAll('.item')
tl.from('header', {
    y: "-100%", scrollTrigger: {
        trigger: 'header',
        // markers: true,
        start: "300px, 10%",
        end: "200px, -200px",
        scrub: 1
    }
}
)

my index.html links to scripts in the following order 

//The {% version %} is a nunjucks shortcode to create a random number to force a cache refresh
<script src="/js/scrollTrigger.js?v={% version %}" defer></script>
  <script src="/js/gsap.js?v={% version %}" defer></script>
  <script src="/js/scripts.js?v={% version %}" defer></script>
  <script src="/js/alpine.js?v={% version %}" defer></script>

Thanks in advance

[ZachSaucier]

Hey James. You should load ScrollTrigger after you load GSAP. See if that fixes your issue.

[JamesGrubb]

Ok will try thanks

[JamesGrubb]

Unfortunately rearranging the links had not effect. Its to do with my little knowledge of ES6 imports. I lack the knowledge in this department. Any other ideas?

[ZachSaucier]

ES6 imports? It looks like you're just trying to load things a script tag? 

 

Check to make sure yoursite.com/js/scrollTrigger.js works because that is the path that you're giving it (and same thing for your other resources).

 

If it doesn't, I'd reach out to Netlify's support. I'm sure they'd be able to help.

[GreenSock]

Minor note: The file we provide is ScrollTrigger.min.js with a capital "S". Looks like you're using a lowercase. May not matter but I wanted to mention it. 

 

It definitely looks like you've got a bad link in there somewhere. Your site isn't loading the ScrollTrigger file at all. 404 error.