laravel中使用vue，gulp打包后报_vueRouter2.default is not a constructor

Question

gulp打包成功，但在页面报js错误：
在Chrome的console中的错误代码：

main.js?6e4b:26 Uncaught TypeError: _vueRouter2.default is not a constructor
    at Object.eval (eval at <anonymous> (main.js:128), <anonymous>:26:14)
    at eval (eval at <anonymous> (main.js:128), <anonymous>:33:30)
    at Object.<anonymous> (main.js:128)
    at __webpack_require__ (main.js:20)
    at main.js:64
    at main.js:67

package.json：

{
  "private": true,
  "devDependencies": {
    "gulp": "^3.8.8",
    "laravel-elixir": "^6.0.0-9",
    "laravel-elixir-browsersync-official": "^1.0.0",
    "laravel-elixir-vue": "^0.1.4",
    "laravel-elixir-webpack-official": "^1.0.2",
    "lodash": "^4.14.0",
    "node-sass" :"^4.0.0",
    "sass": "^0.5.0",
    "sass-loader": "^6.0.3",
    "vue": "^2.1.0",
    "vue-resource": "^1.0.1",
    "vue-router": "^2.1.1",
    "webpack": "^2.1.0"
  },
  "dependencies": {
    "bootstrap-sass": "^3.0.0"
  }
}

gulpfile.js：

var elixir = require('laravel-elixir');

require('laravel-elixir-vue');

elixir(mix => {
    mix.webpack('main.js');
});

main.js:

import Vue from 'vue/dist/vue.js'
import App from './App.vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter);

//开启debug模式
Vue.config.debug = true;

import Example from './components/Example.vue'

const router = new VueRouter({
    mode: 'history',
    base: __dirname,
    routes: [
        { path: '/example', component: Example }
    ]
})

new Vue(Vue.util.extend({ router }, App)).$mount('#app')

Answer 1

new Vue({
    router,
    render: (h) => h(App)
}).$mount('#app')