Laravel项目中Vue 3组件无法显示
P粉032900484
P粉032900484 2024-02-26 11:54:25
[Vue.js讨论组]

我已经尝试了我能想到的一切,但尽管没有构建错误,但我无法在我非常简单的项目中加载 Vue 组件。我不明白为什么,但在尝试使用 Laravelserve 查看页面时,我只是得到一个空白页面。

welcome.blade.php



    
        
        
    
        Laravel
    
        
        
    
     
    
        

app.js

require('./bootstrap');

import { createApp } from 'vue'

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

const app = createApp({});

app.component('home', Home);

app.mount('#app');

Home.vue

webpack.mix.js

const 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', [
        //
    ]);

P粉032900484
P粉032900484

全部回复(2)
P粉262073176

您是否尝试过将刀片中的标签从 <Home /> 更改为 <home /> ? 正如另一个用户所写,您必须在导入组件的行中添加 .default

P粉946336138

由于我的分数,我无法发表评论,抱歉必须像遮阳篷一样做。


您确定 app.component('home', Home); 行是导入 comp 的正确方法吗? 因为根据我的发现,这将是

Vue.component('home', require('./components/Home.vue').default);

就是这样。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号