vue-cli import error

[keepresolve]

vue-cli import VueIntro from 'vue-introJs'; Vue.use(VueIntro);
// error Uncaught SyntaxError: Unexpected token ( autostart.js?9e2a:29

[oltodo]

The problem come from your import reaches vue-introjs/src/index.js file which is es6-formatted. So you have many solutions :

1. Directly importing dist file:

import VueIntro from 'vue-introjs/dist/index.min';

2. Adding a babel-loader in your Webpack config:

module: {
  rules: [{
      test: /\.js$/,
      include: [path.resolve(__dirname, 'node_modules/vue-introjs')],
      loader: 'babel-loader'
  }]
}

3. Create an alias in your Webpack config:

resolve: {
  alias: {
    'vue-introjs': 'vue-introjs/dist/index.min.js'
  }
}

[alex-oleshkevich]

You forgot to add Vue.use(VueIntro)

import VueIntro from 'vue-introjs';
Vue.use(VueIntro);

[ghenry]

That's in test/unit/setup.js and then I get the import error as mentioned in https://forums.manning.com/posts/list/0/43203.page#p121739

[alex-oleshkevich]

I am not sure if your error relates to this package.
AFAIK, it is about wrong webpack\jest\babel setup. Probably, it ignores files from ./node_modules directory (when runs transpiling es6 -> es5)

[alex-oleshkevich]

jestjs/jest#3202
https://stackoverflow.com/questions/42226674/babel-jest-doesnt-handle-es6-within-modules

as mentioned inthe latter:
By default any code in node_modules is ignored by babel-jest, see the Jest config option transformIgnorePatterns.

https://facebook.github.io/jest/docs/en/configuration.html#testpathignorepatterns-array-string

[alex-oleshkevich]

@ghenry, @keepresolve i've published a new release which users ES5 version by default.
please, test if this fixes the issue

[ghenry]

Upgraded. I now get, with no changes:

ReferenceError: introJs is not defined

[ghenry]

ReferenceError: introJs is not defined
          at VueComponent.t.$intro (/home/ghenry/src/SureVoIP-Portal/root/src/client_side/node_modules/vue-introjs/dist/index.min.js:1:9162)
          at VueComponent.mounted (/home/ghenry/src/SureVoIP-Portal/root/src/client_side/src/components/Dashboard.vue:113:10)
          at callHook (/home/ghenry/src/SureVoIP-Portal/root/src/client_side/node_modules/vue/dist/vue.runtime.common.js:2919:21)

[alex-oleshkevich]

@ghenry , introJs is an external depency. Include it in your build before injecting the plugin. Refer docs.

[kanteankit]

introJs is an external depency. Include it in your build before injecting the plugin. Refer doc

@alex-oleshkevich
When I run my jest unit tests, I too am getting the error ReferenceError: introJs is not defined. How, do I inject IntroJS as a plugin in unit tests.