Can't create splitter with Split.js

Question

i have:

<script src="https://unpkg.com/split.js/dist/split.min.js"></script>
<script type="module">
    $(document).ready(function() {
        import Split from 'split.min.js'
        Split(['#split-0', '#split-1'],
            {
                direction: 'vertical'
            });
    });
</script>

So, i have an error:

Uncaught SyntaxError: Unexpected identifier

Error referencing to import Split from 'split.js' What should i do? Code was copied from official site.

Answer 1

If you use the UMD build of script, as you do in your example by referencing the URL https://unpkg.com/split.js/dist/split.min.js, the Split object is not exposed as a JavaScript module that can be accessed through an import statement.

Instead, it will be available as a global variable, which you can access through window.Split or simply Split.

This should work:

<script src="https://unpkg.com/split.js/dist/split.min.js"></script>
<script>
    $(document).ready(function() {
        Split(['#split-0', '#split-1'],
            {
                direction: 'vertical'
            });
    }); 
</script>