Vuetable.vue:3 Uncaught SyntaxError: Unexpected token export

[simplicitysavored]

I got error as follows After excute webapck：

Uncaught SyntaxError: Unexpected token export

I do install babel-preset-es2015.

my package.json:

"dependencies": { "insert-css": "^1.0.0", "jquery": "^3.1.1", "moment": "^2.15.1", "vue": "^1.0.28", "vue-router": "^0.7.13", "vuetable": "^1.5.5" }, "devDependencies":{ "babel": "^6.5.2", "babel-cli": "^6.16.0", "babel-core": "^6.17.0", "babel-loader": "^6.2.5", "babel-plugin-transform-runtime": "^6.15.0", "babel-preset-es2015": "^6.16.0", "babel-runtime": "^6.11.6", "css-loader": "^0.25.0", "html-loader": "^0.4.4", "vue-loader": "^1.1.0", "vue-template-compiler": "^2.0.1", "vuetable": "^1.5.5", "webpack": "^1.13.2" },

and my webpack.config.js:

module: { loaders: [{ test: /.vue$/, loader: 'vue' }, { test: /.css$/, loader: 'style!css!autoprefixer' }, { test: /.(png|jpg|gif)$/, loader: 'url-loader?limit=8192' }, { test: /.(html|tpl)$/, loader: 'html-loader' }, { test: /.js$/, loader: 'babel', //include: projectRoot, exclude: /node_modules/ }, { test: path.join(__dirname, 'es6'), loader: 'babel-loader', query: { presets: ['es2015'] } }] }, babel: { presets: ['es2015'], plugins: ['transform-runtime'] }

I have no idea. anyidea Thanks！

[ratiw]

@JavaCodeFish Looks more like the problem with your configuration, not vuetable itself. Unfortunately, I'm not an expert on this as well. I basically use vue-cli and everything just work for me.

[simplicitysavored]

@ratiw I guess the configuration of the problem, but do not know where the problem,Also I have to look for information

[simplicitysavored]

@ratiw I used npm install vuetable -D , and my entry main.js:

import Vuetable from 'vuetable/src/components/Vuetable.vue'; import VuetablePagination from 'vuetable/src/components/VuetablePagination.vue'; import VuetablePaginationDropdown from 'vuetable/src/components/VuetablePaginationDropdown.vue';

Vue.component('vuetable', Vuetable); Vue.component('vuetable-pagination', VuetablePagination); Vue.component('vuetable-pagination-dropdown', VuetablePaginationDropdown);

new Vue({ el: '#app', data: { columns: [ 'firstname', 'lastname', 'nickname', 'birthdate', 'group.name_en', 'gender', 'last_login', '__actions' ] } })

and in index.html:

< div id="app" > < vuetable api-url="/api/users" :fields="columns" >< /vuetable > < /div > < script src="bundle.js" >

Those code wrong?

[ratiw]

@JavaCodeFish Looks good to me. What's the error message or the problem you've having?

[simplicitysavored]

@ratiw I got the browser error as follows:

bundle.js:125 Uncaught SyntaxError: Unexpected token export

and In line 125 as follows:

[ratiw]

@JavaCodeFish I definitely think it's the problem with your webpack configuration, but I really don't know how to help on that. Why don't you try using vue-cli to create your test probject and then move the code over.

[ratiw]

@JavaCodeFish You can also try this example. It's been outdated but I think it's still work. Also, check if your NPM is up to date? Some people has reported the problem's gone once they've updated it.

[simplicitysavored]

@ratiw Thank you for your help, I'll try it.

[simplicitysavored]

@ratiw

I tried vue-cli the next, excuted vue init webapck-simple#1.0 vue-cli-demo, and vuetable work well, Although some minor problems during the period.

It seems that the official template configuration better, and I configure the document is a problem, although still do not know where the specific wrong. But the problem is solved.

Especially thank you for your suggestions