[how to use gsap (installed with npm) inside HTML script for specific pages?]

ok, I'll try to check, thank you

[how to use gsap (installed with npm) inside HTML script for specific pages?]

yes, I've your same code in my HTML taking another equal example
 

<script src="dist/js/app.js"></script>

<script>
  const header = document.querySelector('header');

  gsap.from(header,
            {
    y: -40,
    delay: 0.25
  }
  )
</script>

in my gsap.js bundled in app.js
 

import { gsap } from "gsap";

this solution returns in console "Uncaught ReferenceError: gsap is not defined at index.html"

But if i move all my script inside gsap.js bundled in app.js the animation works correctly

import { gsap } from "gsap";

const header = document.querySelector('header');

gsap.from(header,
    {
  		y: -40,
  		delay: 0.25
	}
)

it's the same code, written all in the js file it's ok, but if I put the animation script in the html I get the error in console...
thank you

[how to use gsap (installed with npm) inside HTML script for specific pages?]

hi, thanks for your time
I've used webpack (I'm studying a bit)
 

const path = require('path');
const webpack = require('webpack');

module.exports = {
   mode: 'development',
   entry: [ 
      './src/js/main.js', 
      './src/js/owl-carousel.js', 
      './src/js/gsap.js' 
   ],
   output: {
      path: path.resolve(__dirname, 'dist/js'),
      filename: 'app.js',
   },
   plugins: [
      new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery'
      }),
   ],
   module: {
      rules:[
       {
          test: /.(scss|css)$/,
          use:
          [
             {
                options: { reloadAll: true },
             },
             'css-loader',
             'sass-loader',
             'node-sass'
          ]
       }
      ]
   }
};

 

[how to use gsap (installed with npm) inside HTML script for specific pages?]

Hello world, 

i've installed gsap from "npm instal gsap"

in my app.js file (called in html script) works fine with:

import {gsap} from "gsap"
gsap.from('nav', { y: 40, delay: 0.25 });

but i would like to use gsap from app.js for generic animations for all pages and others for specific pages in html , for example in about page

<script>
gsap.from('.about h1', { y: 40, delay: 0.25 });
</script>

This codes return "gsap is not defined", how can I solve it? the same code inside app.js works, but not in this way. thank you