Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[15.0.0-beta.2] VueLoaderPlugin Error: no matching rule for vue files are found.

See original GitHub issue

Version

15.0.0-beta.2

Reproduction link

n/a

Steps to reproduce

I noticed that i am getting this error when rule for .vue files contains include option with absolute folder path. Example of failing webpack config

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

const src = path.resolve(__dirname, 'src');

module.exports = {
  entry: {
    app: path.join(src, 'index.js'),
  },
  output: {
    publicPath: '/',
    path: path.resolve(__dirname, 'build'),
    filename: '[name].bundle.js',
    chunkFilename: '[id].[name].chunk.js',
  },
  resolve: {
    extensions: [
      '.js',
      '.vue',
    ],
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        include: src,
        loader: 'babel-loader',
      },
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        include: src, // <-- causes the error
        options: {
          preserveWhitespace: false,
        },
      },
    ],
  },
  plugins: [
    new VueLoaderPlugin(),
  ],
};

Full log:

Error: VueLoaderPlugin Error: no matching rule for vue files are found.
    at VueLoaderPlugin.apply (C:\dev\vue-loader-next\node_modules\vue-loader\lib\plugin.js:19:13)
    at Compiler.apply (C:\dev\vue-loader-next\node_modules\tapable\lib\Tapable.js:375:16)
    at webpack (C:\dev\vue-loader-next\node_modules\webpack\lib\webpack.js:33:19)
    at processOptions (C:\dev\vue-loader-next\node_modules\webpack\bin\webpack.js:335:15)
    at yargs.parse (C:\dev\vue-loader-next\node_modules\webpack\bin\webpack.js:397:2)
    at Object.Yargs.self.parse (C:\dev\vue-loader-next\node_modules\yargs\yargs.js:533:18)
    at Object.<anonymous> (C:\dev\vue-loader-next\node_modules\webpack\bin\webpack.js:152:7)
    at Module._compile (module.js:662:30)
    at Object.Module._extensions..js (module.js:673:10)
    at Module.load (module.js:575:32)
    at tryModuleLoad (module.js:515:12)
    at Function.Module._load (module.js:507:3)
    at Function.Module.runMain (module.js:703:10)
    at startup (bootstrap_node.js:193:16)
    at bootstrap_node.js:665:3

Webpack version 3.11.0

What is expected?

I would like to bundle my project without error.

What is actually happening?

Webpack throws mentioned error

Issue Analytics

State:
Created 5 years ago
Comments:7 (1 by maintainers)

Top GitHub Comments

1reaction

loilocommented, Apr 25, 2018

@Heartnett Are you looking for the vue-loader docs?

1reaction

loilocommented, Mar 23, 2018

That was a quick sequence of issues. 😁

Top Results From Across the Web

VuetifyLoaderPlugin Error No matching rule for vue-loader found

Make sure there is at least one root-level rule that uses vue-loader and VuetifyLoaderPlugin is applied after VueLoaderPlugin. The package.json:

[VueLoaderPlugin Error] No matching use for vue-loader is ...

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

vue-loader | Yarn - Package Manager

Allows custom blocks in a .vue file that can have custom loader chains applied to them;; Treat static assets referenced in <style> and...

Untitled

<a name="15.10.0"></a> # [15.10.0](https://github.com/vuejs/vue-loader/compare/v15.10.0- ... (2020-06-23) ### Bug Fixes * skip matching rule with 'enforce' ...

Renovate Bot Package Diff

[15.9.2](https://github.com/vuejs/vue-loader/compare/v15.9.1...v15.9.2) ... throw new Error(`[VueLoaderPlugin Error] No matching rule for .vue files found.