'laravel 8 + vue 3 无法读取未定义的属性（读取'组件'）'答案

【问题标题】：'laravel8 + vue3 Cannot read properties of undefined (reading 'component')''laravel 8 + vue 3 无法读取未定义的属性（读取'组件'）'
【发布时间】：2021-11-11 11:37:09
【问题描述】：

'laravel8 + vue3 错误 Uncaught TypeError: Cannot read properties of undefined (reading 'component')

如何避免这个错误？

app.js

window.Vue = require('vue').default;
Vue.component('hello', require('./hello.vue').default);
const app = new Vue({
    el: '#app'
});

welcome.blade.php

<body class="antialiased">
    <div class="relative flex items-top justify-center min-h-screen bg-gray-100 dark:bg-gray-900 sm:items-center py-4 sm:pt-0">
        <div id="app">
            <hello></hello>
        </div>
    </div>
    <script src="{{mix('js/app.js')}}"></script>
</body>

hello.vue

<template>
    <div>
        Hello World!
    </div>
</template>

package.json

"devDependencies": {
    "@vue/compiler-sfc": "^3.2.11",
    "axios": "^0.21",
    "laravel-mix": "^6.0.6",
    "lodash": "^4.17.19",
    "postcss": "^8.1.14",
    "vue": "^3.2.11",
    "vue-loader": "^16.5.0"
}

这个错误出现在vue3

告诉我如何避免它

【问题讨论】：

标签： laravel vue.js vuejs2 vue-component laravel-8

【解决方案1】：

在Vue3 你的app.js 应该是这样的：

require('./bootstrap');

import { createApp } from 'vue';
import hello from './components/hello.vue';

let app=createApp({})
app.component('hello' , hello);

app.mount("#app")

【讨论】：