在nuxt布局中使用动态组件获取运行时编译错误

Question

在我的nuxt应用程序中。在布局文件中，使用动态组件来设置不同页面中的组件，如下方

<template>
<div id="app">
<div id="app-body">
<div id="app-topbar">
<component v-bind:is="actionBar.component"></component>
</div>
<div id="app-content">
<nuxt />
</div>
</div>
</div>
</template>

但是当我运行应用程序时，我在下面看到了错误

You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

我会尝试用no-ssr标签包装我的component，但错误仍然存在

Answer 1

正如DigitalDrifter已经说过的，您需要使用包含编译器的构建。

要在nuxt中做到这一点，请尝试在nuxt.config.js:中添加以下内容

build: {
extend(config, ctx) {
config.resolve.alias['vue'] = 'vue/dist/vue.common'