无效的配置对象。对象已初始化 ('webpackbar')

Question

在上周，我探索了 Laravel + Vue 开发的世界，因为我需要一些这方面的知识来进行即将到来的实习。

到目前为止，我已经创建了另外 2 个概念证明，但均未出现此错误。但是当我创建第三个概念验证时，这个错误突然变成了一个问题。当我创建一个新项目并再次放入相同的东西时，它甚至会重新出现。与之前创建应用程序相比，我不记得做了什么不同的事情。

当我运行 'npm run hot' 启动我的前端 Vue 应用程序时出现错误。（注意：npm 运行 watch 确实有效，这是运行 hot 的问题）。这是完整的错误：

[webpack-cli] Invalid configuration object. Object has been initialized using a configuration object that does not match the API schema. - configuration has an unknown property 'webpackbar'. These properties are valid: object { bonjour?, client?, compress?, devMiddleware?, f?, https?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, public?, setupExitSignals?, static?, transportMode?, watchFiles? }

我曾看到类似的问题与 'webpackbar' 以外的另一个词有关，但从未具体与 'webpackbar' 相关，所以我想我会问一个新问题。

我不知道我需要显示哪些文件才能让你们中的一些人理解错误，所以请发表评论或回答你们都需要查看哪些文件。这里有一些可能相关的（不确定，我是这个框架的新手）。

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]).vue().disableNotifications();

app.js

require('./bootstrap');

import Vue from 'vue'
import App from './vue/app'
import VueRouter from 'vue-router';
import routes from './routes';
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

Vue.use(BootstrapVue)
Vue.use(IconsPlugin)
Vue.use(VueRouter);

const app = new Vue({
    el: '#app',
    components: { App },
    router: new VueRouter(routes)
})

package.json

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "axios": "^0.21.1",
        "laravel-mix": "^6.0.6",
        "lodash": "^4.17.19",
        "postcss": "^8.1.14",
        "vue-template-compiler": "^2.6.14"
    },
    "dependencies": {
        "bootstrap": "^5.1.0",
        "bootstrap-vue": "^2.21.2",
        "vue": "^2.6.14",
        "vue-loader": "^15.9.8",
        "vue-router": "^3.5.2"
    }
}

如有任何评论或回答，我们将不胜感激！

Answer 1

事实证明这是 laravel-mix 包中的错误。它在我安装下一个更新后立即修复。（npm 更新）

无效的配置对象。对象已初始化 ('webpackbar')

Invalid configuration object. Object has been initialized ('webpackbar')

npm

laravel

webpack

vue.js

laravel-mix