VueLoaderPlugin错误:找不到vue-loader的匹配用法

Question

我在Laravel Mix项目中使用了webpack。当我的webpack.config.js看起来像这样时，Webpack的工作没有错误：

module.exports = {
    module: {
        rules: [{ test: /\.vue$/, loader: 'vue-loader' }]
    }
}

但是当我像这样添加VueLoaderPlugin时：

const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = {
    module: {
        rules: [{ test: /\.vue$/, loader: 'vue-loader' }]
    },
    plugins: [
        // make sure to include the plugin for the magic
        new VueLoaderPlugin()
    ]
}

我得到了这个错误：

Error: [VueLoaderPlugin Error] No matching use for vue-loader is found.
Make sure the rule matching .vue files include vue-loader in its use.

这没有任何意义，因为我已经有了一个包含vue-loader的.vue规则。这里的问题是什么，我该如何解决它？

Answer 1

您的Laravel mix设置已经隐式加载了VueLoaderPlugin，因此再次重新加载会导致此错误。

从他们的文档中可以看出，他们支持.vue文件编译而不需要额外的配置。

如果您仍然不信服，请查看他们的内部web包配置：https://www.github.com/JeffreyWay/laravel-mix/tree/master/src%2Fcomponents%2FVue.js，并注意VueLoaderPlugin的使用。

Answer 2

将配置文件中的导入重写为：

const { VueLoaderPlugin } = require("vue-loader");