Aos: How should I import AOS with webpack ?

[esperancaJS]

I've tried:

import { AOS } from 'aos';

import * as AOS from 'aos';

the error is always:
Cannot find name 'aos'

[esperancaJS]

import * as AOS from 'aos/dist/aos.js';

fixes it for now

[michalsnik]

You should be able to simply: import AOS from 'aos' this is how I use it and it works fine :)

[greenchapter]

I also tried to run aos with webpack and I imported aos in my entry.js like that

import AOS from '../../../node_modules/aos/dist/aos.js'

than I added at the and of my HTML file this

<script> AOS.init({ easing: 'ease-in-out-sine' }); </script>

But I also get Uncaught ReferenceError: AOS is not defined

[marianoj]

You need to import using: import AOS from 'aos';
The import works OK for me but I still get the not defined issue, any ideas how to run it?

[onetrev]

Similar to what was noted here, to stop the "AOS is not defined error" I too just had to add the require line above the init like so:

var AOS = require('aos');
AOS.init();

Otherwise as @michalsnik said you should just be able to import AOS as per the docs, import AOS from 'aos'. But I wonder if the var setup line needs to be added to the documentation? Not sure why some folks need that and some do not. But I'm far from a webpack expert.

[zlinker89]

this work fine.... only add

import AOS from 'aos';
import 'aos/dist/aos.css';

AOS.init();

[koistav1212]

Where to write import AOS from 'aos' ?
In my Javascript or html or css plzz specify the position..

[emre-edu-tech]

In my situation at first
import AOS from 'aos';
and
AOS.init();
were in different files. Then I put the import statement in the same file with AOS call and now it seems working fine.