J'ai essayé tout ce à quoi je pouvais penser, mais malgré l'absence d'erreur de construction, je n'arrive pas à charger les composants Vue dans mon projet très simple. Je ne comprends pas pourquoi, mais lorsque j'essaie d'afficher la page à l'aide de Laravelserve, je reçois simplement une page vierge.
welcome.blade.php<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
</head>
<body class="antialiased">
<div id='app'>
<Home />
</div>
<script scr="{{ asset('js/app.js') }}"></script>
</body>
</html>
app.jsrequire('./bootstrap');
import { createApp } from 'vue'
import Home from './components/Home.vue';
const app = createApp({});
app.component('home', Home);
app.mount('#app');
Home.vue<template>
<div>
<h1> WELCOME </h1>
</div>
</template>
webpack.mix.jsconst mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel applications. By default, we are compiling the CSS
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js')
.vue()
.postCss('resources/css/app.css', 'public/css', [
//
]); 
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Avez-vous essayé de changer les languettes de la lame de
<Home />更改为<home />? Comme l'a écrit un autre utilisateur, vous devez ajouter .default dans la ligne où vous importez le composantJe ne peux pas commenter à cause de mon score, désolé je dois faire comme un auvent.
Êtes-vous sûr que la ligne
app.component('home', Home);est la bonne façon d'importer une composition ? Parce que d'après ce que j'ai trouvé, ce seraitVue.component('home', require('./components/Home.vue').default);C'est tout.