gpt4 book ai didi

javascript - Vue 模板或渲染函数尚未定义,但我两者都没有使用?

转载 作者:可可西里 更新时间:2023-11-01 01:22:28 27 4
gpt4 key购买 nike

这是我的主要 javascript 文件:

import Vue from 'vue'

new Vue({
el: '#app'
});

我的 HTML 文件:

<body>
<div id="app"></div>

<script src="{{ mix('/js/app.js') }}"></script>
</body>

使用运行时构建的 Vue.js Webpack 配置:

alias: {
'vue$': 'vue/dist/vue.runtime.common.js'
}

我仍然遇到这个众所周知的错误:

[Vue warn]: Failed to mount component: template or render function not defined. (found in root instance)

为什么当我在挂载 Vue 的 #app div 中什至没有任何东西时,我仍然收到渲染/模板错误?它说 found in root 但没有找到任何内容,因为它甚至没有任何内容?

如果这不起作用,我该如何挂载?

编辑:

我试过这样的,似乎有效:

new Vue(App).$mount('#app');

这是有道理的,因为使用 el 属性意味着您正在“扫描”该 dom 元素以查找任何组件,但它是无用的,因为运行时构建没有编译器。

这仍然是一条非常奇怪的错误消息,尤其是当我清空整个#app div 时。

希望有人能证实我的想法。

最佳答案

就我而言,我收到错误是因为我从 Laravel Mix 版本 2 升级到版本 5。

在 Laravel Mix Version 2 中,您可以按如下方式导入 vue 组件:

Vue.component(
'example-component',
require('./components/ExampleComponent.vue')
);

在 Laravel Mix 版本 5 中,您必须按如下方式导入组件:

import ExampleComponent from './components/ExampleComponent.vue';

Vue.component('example-component', ExampleComponent);

这是文档: https://laravel-mix.com/docs/5.0/upgrade

更好的是,为了提高应用程序的性能,您可以延迟加载组件,如下所示:

Vue.component("ExampleComponent", () => import("./components/ExampleComponent"));

关于javascript - Vue 模板或渲染函数尚未定义,但我两者都没有使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41983767/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com