Vue-loader: 开发环境中使用了路由懒加载，刷新浏览器有时会有报错信息

[zhengjunxiang]

在webpack-dev-server打开发环境中，启动项目是正常的，但在热更新或刷新浏览器时，经常会有以下报错信息：

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <Anonymous>
       <ICol> at node_modules/iview/src/components/grid/col.vue
         <Row> at node_modules/iview/src/components/grid/row.vue
           <App> at src/pages/App.vue
             <Root>

经过试验发现，之前是使用了路由懒加载会出现问题：

import Vue from 'vue'
import Router from 'vue-router'

const Home = resolve => require(['../pages/Home'], resolve)
const Order = resolve => require(['../pages/Order/Order'], resolve)
const Configuration = resolve => require(['../pages/Configuration'], resolve)
const User = resolve => require(['../pages/User'], resolve)
const NotFoundComponent = resolve => require(['../pages/NotFoundComponent'], resolve)

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    }, {
      path: '/order',
      name: 'Order',
      component: Order
    }, {
      path: '/configuration',
      name: 'Configuration',
      component: Configuration
    }, {
      path: '/user',
      name: 'User',
      component: User
    }, {
      path: '*',
      component: NotFoundComponent
    }
  ]
})

当不使用路由懒加载，换成import myComponent from '../path' 的方式，就不会有问题。
vue-loader在webpack里的配置是vue-cli 生成的webpack项目是一样的；

package.json：

"dependencies": {
    "axios": "^0.16.2",
    "connect-history-api-fallback": "^1.3.0",
    "ejs": "^2.5.6",
    "express": "^4.15.3",
    "global": "^4.3.2",
    "iview": "^2.0.0",
    "moment": "^2.18.1",
    "nodemon": "^1.11.0",
    "vue": "^2.4.1",
    "vue-router": "^2.7.0",
    "vuex": "^2.3.1"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.25.0",
    "babel-eslint": "^6.0.4",
    "babel-loader": "^7.1.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-3": "^6.24.1",
    "chunk-manifest-webpack-plugin": "^1.1.0",
    "cors": "^2.8.3",
    "cross-env": "^5.0.1",
    "css-loader": "^0.28.4",
    "eslint": "^3.19.0",
    "eslint-config-standard": "^6.2.1",
    "eslint-plugin-html": "^2.0.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-promise": "^3.4.0",
    "eslint-plugin-standard": "^2.0.1",
    "extract-text-webpack-plugin": "^2.1.2",
    "file-loader": "^0.11.2",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "happypack": "^4.0.0-beta.1",
    "html-webpack-plugin": "^2.29.0",
    "less": "^2.7.2",
    "less-loader": "^4.0.4",
    "opn-cli": "^3.1.0",
    "os": "^0.1.1",
    "postcss-loader": "^2.0.6",
    "rimraf": "^2.6.1",
    "style-loader": "^0.18.2",
    "url-loader": "^0.5.9",
    "vue-loader": "^13.0.1",
    "vue-style-loader": "^3.0.1",
    "vue-template-compiler": "^2.4.1",
    "webpack": "^3.3.0",
    "webpack-chunk-hash": "^0.4.0",
    "webpack-dev-server": "^2.5.1",
    "webpack-merge": "^4.1.0"
  },

刚使用vue半个月的小白请大侠解答

[forsaken628]

同样的问题，13.0.4版本会出现，降级到12.2.2就正常了，环境是electron

[PanJiaChen]

https://github.com/vuejs/vue-loader/releases/tag/v13.0.0
看一下人家的说明咯

[Jinjiang]

Using const Foo = require('./Foo.vue').default instead of const Foo = require('./Foo.vue') in v13.0.0+.
@kazupon @yyx990803 I guess this issue could be closed.
Thanks.

[SageSanyue]

Smilar problem, when I write:

let routes = [{
    path: '/',
    component: require('./components/member.vue')
}]

it failed:[Vue warn]: Failed to mount component: template or render function not defined.
add ".default", it works!

let routes = [{
    path: '/',
    component: require('./components/member.vue').default
}]

PS:"vue": "^2.5.2","vue-router": "^3.0.1""vue-loader": "^13.3.0",