Adding the Intro.JS library to a Vue-Cli / Webpack project

Question

I'm building my first project using vue-cli and webpack and I'm not sure how to properly use an external JavaScript library to my project.

I want to add the Intro.js library which simply requires me to import the intro.js, add some tags to some HTML elements, and call the introJs().start() function.

I've installed the library with npm install introj.js --save

I've imported the library by adding import introJS from 'intro.js' into my <script> section of my App.vue file.

I've checked the compiled app.js file and I know introJS is being compiled so everything is good there.

My question is, where do I put introJs().start()? I tried putting it in the mounted() function of the App.vue file but that doesn't work.

Additional Info: When I try to run introJS().start() from the mounted () method in App.vue I receive this error: Error in mounted hook: "TypeError: __WEBPACK_IMPORTED_MODULE_7_intro_js___default(...) is not a function"

Answer 1

This should work:

const { introJS } = require('intro.js')
introJS().start()