Can't get glidejs working with pug template

80 Views Asked by At

I have imported the three files inside my project (core, theme and glidejs)

But the layout seems weird : weirdo layout

HTML:

doctype html
html(lang=fr)
    head
        title= 'Toutounet'
        link(rel='stylesheet' href='/assets/glide/glide.core.min.css')
        link(rel='stylesheet' href='/assets/glide/glide.theme.min.css')
        script(src='/assets/glide/glide.min.js')
        script.
            new Glide('.glide').mount()
    body
        div(class='glide')
        div(class='glide__track' data-glide-el='track')
            ul(class='glide__slides')
                li(class='glide__slide') slide1
                li(class='glide__slide') slide2
                li(class='glide__slide') slide3
        div(class='glide__arrows' data-glide-el='controls')
            button(class='glide__arrow glide__arrow--left' data-glide-dir='<') prev
            button(class='glide__arrow glide__arrow--right' data-glide-dir='>') next

And the text on button doesn't appear.

Moreover I tried to import the node package via :

npm i --save @glidejs/glide 

But the link doesn't work like the documentation said (href="node_modules/@glidejs/glide/dist/css/glide.core.min.css") and the package is not added in my node_modules directory.

thx.

Edited after @Sean response But now I can't see the arrows.

0

There are 0 best solutions below