If importing the default object of .js
file in a .vue
file, the default object will be wrapped.
foo.js
export default {
bar: 123
};
some.vue
import foo from './foo';
// need to use foo.default to access the default object
console.log(foo.default.bar);
I think the problem is because vue-loader
did not config the babel option: modules: false
at https://github.com/nuxt/nuxt.js/blob/master/lib/build/webpack/vue-loader.config.js#L7
let config = {
postcss: this.options.build.postcss,
loaders: {
'js': 'babel-loader?presets[]=es2015&presets[]=stage-2',
'less': 'vue-style-loader!css-loader!less-loader',
'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax',
'scss': 'vue-style-loader!css-loader!sass-loader',
'stylus': 'vue-style-loader!css-loader!stylus-loader',
'styl': 'vue-style-loader!css-loader!stylus-loader'
}
}
I wonder why set the babel options here rather than use the .babelrc ?
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This bug report is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c47">#c47</a>)</em></sub></div>