webpack vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin

最新推荐文章于 2023-08-25 15:24:27 发布

原创最新推荐文章于 2023-08-25 15:24:27 发布 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue-loader #vue #webpack

Vue 专栏收录该内容

7 篇文章

订阅专栏

本文档介绍了在使用webpack时遇到vue-loader警告：'vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin'的解决方法。原因是从vue-loader 15.*版本开始需要配合VueLoaderPlugin一起使用。解决方案是将vue-loader版本降级到14.*，或者在webpack配置中添加VueLoaderPlugin。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题

vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.

原因

. 参考官方文档 https://vue-loader.vuejs.org/migrating.html#a-plugin-is-now-required
. Vue-loader在15.*之后的版本都是 vue-loader的使用都是需要伴生 VueLoaderPlugin的

解决方法

将vue-loader版本回归成14.* （查询版本传送门：https://www.npmjs.com/package/vue-loader）
ps：最后一个14的版本是14.2.2， npm install vue-leader@14.2.2
修改webpack.config.js

const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = {
    devtool: "sourcemap",
    entry: './js/entry.js', // 入口文件
    output: {
        filename: 'bundle.js' // 打包出来的文件
    },
    plugins: [
        // make sure to include the plugin for the magic
        new VueLoaderPlugin()
    ],
    module : {
        ...
    }
}