How can I import node module into svelte component

user_11585314 0
Viewed 5985

I'm new to svelte and I am trying to use an installed node module in my dependancies called momentum-slider. In the script tags of my svelte component I have:

import MomentumSlider from "../../node_modules/momentum-slider";
let slider = new MomentumSlider({
   el: ".ms-container",
});

In my component's html markup I have the suggested markup as shown in the tutorial at https://scotch.io/tutorials/building-a-fancy-countdown-timer-with-momentumsliderjs

However, I am getting a typeError in the browser console:

enter image description here

I am new to development in general and I am not sure if this is a problem with momentum-slider or an error on my part. Any insights would be much appreciated.

typeerror npm svelte import module
2 Answers

Not sure how to use this library but you should take care of 2 things. First import your package like the following:

import MomentumSlider from "momentum-slider";

Second you need to initialise the MomentumSlider class when the component is mounted using onMount:

import { onMount } from "svelte";
import MomentumSlider from "momentum-slider";

let slider;

onMount(() => {
  slider = new MomentumSlider({ 
    el: ".ms-container"
  });
});

Edit exciting-bouman-dyywc

user_85836690

If you have installed the package properly: npm install momentum-slider the package is listed in your package.json.

When this fits, you just have to import: import MomentumSlider from "momentum-slider";

user_79124160
Related