我看到了一些建议,但我仍然不能调用组件从刀片内联调用
这是我的示例代码
//app.js文件:
import { createApp } from "vue";
import TestComponent from "./src/components/test-component.vue";
const app = createApp({});
app.component("test-component", TestComponent);
// component
app.component("example-component", {
template: `
<div>
<slot>GO GO GO</slot>
</div>`,
});
console.log(TestComponent);
app.mount("#app");
//createApp(TestComponent).mount("#app"); //Works
console.log("Hello");
字符串
刀片:
<div id="app">
<example-component />
<test-component />
</div>
@vite('resources/js/app.js')
型
test-component.vue
<template>
<div>
<h1>Hello, Vue in Laravel!</h1>
<p>{{ message }}</p>
</div>
</template>
<script>
export default {
name: 'TestComponent',
data() {
return {
message: 'This is a Test Vue component in Laravel!',
};
},
};
</script>
型
我尝试了不同的方法,通过命名组件(如kebab-case或not kebab)
尝试使用已清除的生成缓存运行.. npm run build -clearCache
控制台中没有任何错误..
1条答案
按热度按时间relj7zay1#
解决了!
我在vite.config.js中添加了
字符串
在此之后,它的工作!