Vue 报错 「Failed to mount component」

201807022323.png

vue-loader 更新导致

解决方法

1
2
3
4
5
6
7
8
const routes = [
{
name: 'home',
path: '/',
- component: require('Home.vue')
+ component: () => import('Home.vue')
},
];

参见 GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
Breaking Changes
The esModule option is now true by default, because this is necessary for ES-module-based scope hoisting to work. This means the export from a *.vue file is now an ES module by default, so async components via dynamic import like this will break:

const Foo = () => import('./Foo.vue')
Note: the above can continue to work with Vue 2.4 + vue-router 2.7, which will automatically resolve ES modules' default exports when dealing with async components. In earlier versions of Vue and vue-router you will have to do this:

const Foo = () => import('./Foo.vue').then(m => m.default)
Alternatively, you can turn off the new behavior by explicitly using esModule: false in vue-loader options.

Similarly, old CommonJS-style requires will also need to be updated:

// before
const Foo = require('./Foo.vue')

// after
const Foo = require('./Foo.vue').default
PostCSS 6 might break old PostCSS plugins that haven't been updated to work with it yet.
本站文章除注明转载外均为原创,未经允许不要转载哇. ヾ(゚ー゚ヾ) http://qwqaq.com/83cd7c12.html
分享到 评论