TypeError: Vue.component 不是函数 laravel 项目答案

【问题标题】：TypeError: Vue.component is not a function laravel projectTypeError: Vue.component 不是函数 laravel 项目
【发布时间】：2018-09-20 01:33:19
【问题描述】：

这似乎是一个长期存在的问题。我到处寻找解决方案，但还没有成功。我将从控制台发布确切的错误消息：

app.js:34588 Uncaught TypeError: Vue.component is not a function
at Object.supportsPassive (app.js:34588)
at __webpack_require__ (app.js:20)
at Object.<anonymous> (app.js:12599)
at __webpack_require__ (app.js:20)
at Object.defineProperty.value (app.js:12588)
at __webpack_require__ (app.js:20)
at app.js:63
at app.js:66

现在是我的 package.json：

 "devDependencies": {
    "axios": "^0.18.0",
    "cross-env": "^5.2.0",
    "laravel-mix": "^2.0",
    "lodash": "^4.17.5",
    "popper.js": "^1.12",
    "vue": "^2.5.7"
},
"dependencies": {
    "vee-validate": "^2.1.0-beta.9",
    "vue-router": "^3.0.1",
    "vuetify": "^1.2.3",
    "vuex": "^3.0.1"
}

app.js

import Vue from 'vue'
import './plugins/bootstrap'
import './plugins/vuetify'
import router from './plugins/routes'

/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */
// Vue.component('entry', require('./pages/Home.vue'));

const app = new Vue({
    el: '#app',
    router
});

【问题讨论】：

vue 应该不是开发依赖项。事实上，我怀疑除了 laravel-mix 和 cross-env 之外的任何东西都应该存在开发依赖
那么app.js 中的代码是什么样的？
需要导入Vue，即import Vue from 'vue'。投票结束是一个错字
在引导文件中导入
这不会将Vue 符号导入app.js。使用模块时，您需要导入所需的所有内容。我不明白你为什么将Vue 分配给window 或混合import 和require。看起来很奇怪

标签： laravel vue.js axios

【解决方案1】：

我正在对一个 laravel 7 项目进行一些依赖更新，它开始在 vue 编译视图上看到这个错误。我更改了Vue包调用：

使用 import Vue from 'vue' 而不是 window.Vue = require("vue"); 为我工作。

【讨论】：

【解决方案2】：

我是 Vue.js 的新手，所以我将分享我是如何让我的应用运行的。我正在使用 Laravel 9 和 Vue 3。我的代码如下：

// import Vue from 'vue';
import {
    createApp
} from 'vue';

const app = createApp({});

Vue.component('mainapp', require('./components/mainapp.vue').default)

app.mount('#app');

这给出了以下错误：

无法读取未定义的属性（读取“组件”）

所以，我做了一个 console.log(Vue)，得到了undefined。然后我改成

app.component('mainapp', require('./components/mainapp.vue').default)

它成功了！

【讨论】：