Vue import failing

Question

I've created a vue application scaffolded from the vue cli. Almost everything is reacting as expected with my app except for an issue with import.

The following works fine:

import Vuex from 'vuex';

but, this throws errors:

import { VuetronVue, VuetronVuex } from 'vuetron';
vue.use(VuetronVue);

Linting error:

"export 'VuetronVue' was not found in 'vuetron'

and Console error:

Uncaught TypeError: Cannot read property 'install' of undefined

Changing the code to:

import vuetron from 'vuetron'
vue.use(vuetron.VuetronVue);

resolves the issue...

This original code was taken directly from the Vuetron documentation. Does anyone have a suggestion as to why the ES6 notation would cause an issue?

https://stackoverflow.com/questions/36795819/when-should-i-use-curly-braces-for-es6-import/36796281. I believe this will help you — eugene, Dec 26 '17 at 09:59
Lara Belle - yes, I did. Both the npm install and the standalone app. I followed the instructions from the docs and it works if I use the second method. @cuongngo - thank you. At first blush the info in there makes sense and matches my understanding of when to use curly braces on an import. I will have to dig into the vuetron source to see if the pieces are set for export or not. I was simply copying the example from the docs at the time. Also wondering if I have something in my config set up improperly that would result in vuetron ES6 imports not working since the ES5 approach works. — user2540786, Dec 28 '17 at 04:39

score 0 · Answer 1 · answered Jul 18 '18 at 10:15

This seems to be because

vuetron/packages/vuetron-plugins/index.js

only exports the default object:

import VuetronVue from './vuetron-vue';
import VuetronVuex from './vuetron-vuex';

export default {
  VuetronVue,
  VuetronVuex
};

For named imports as stated in the docs you would need a named export.

1 Answers1