项目中报错: vue-loader was used without the corresponding plugin.

项目报错:

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

1 确认当前的环境,检查vue-loader 和webpack的环境,如果vue-loader的版本超过15,则需要伴生VueLoaderPlugin使用

项目中报错: vue-loader was used without the corresponding plugin._第1张图片
2 在webpack.conf.js的文件中添加

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

3 根据官方文档解释,在 webpack 中,所有的预处理器需要匹配对应的 loader。Vue Loader 允许你使用其它 webpack loader 处理 Vue 组件的某一部分。它会根据 lang 特性以及你 webpack 配置中的规则自动推断出要使用的 loader

  1. 首先安装预处理器: npm install -D stylus stylus-loader
  2. 在webpack.config.js中添加相关的规则
module.exports = {
  module: {
    rules: [
      // ... 忽略其它规则

      // 普通的 `.scss` 文件和 `*.vue` 文件中的
      // `