question-mark
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.

Vue loader was used without the corresponding plugin

See original GitHub issue

Version

15.9.6

Reproduction link

http://it-is-not-a-link-read-below.im

Steps to reproduce

I updated project to webpack 5, and after building got that error

//package.json

 "devDependencies": {
    "@babel/core": "^7.13.16",
    "@babel/plugin-proposal-export-default-from": "^7.12.13",
    "@babel/plugin-proposal-optional-chaining": "^7.13.12",
    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
    "@babel/plugin-transform-runtime": "^7.13.15",
    "@babel/preset-env": "^7.13.15",
    "@babel/runtime": "^7.13.17",
    "@fortawesome/fontawesome-pro": "^5.15.3",
    "@nuxt/friendly-errors-webpack-plugin": "^2.5.1",
    "@vue/test-utils": "^1.1.4",
    "autoprefixer": "^10.2.5",
    "axios": "^0.21.1",
    "babel-engine-plugin": "^0.3.0",
    "babel-eslint": "^10.1.0",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-jest": "^26.6.3",
    "babel-loader": "^8.2.2",
    "babel-plugin-module-resolver": "^4.1.0",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-vue-jsx": "^3.7.0",
    "babel-polyfill": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "chalk": "^4.1.1",
    "copy-webpack-plugin": "^8.1.1",
    "core-js": "^2.6.12",
    "cross-env": "^7.0.3",
    "css-loader": "^5.2.4",
    "css-minimizer-webpack-plugin": "^2.0.0",
    "eslint": "^7.25.0",
    "eslint-config-standard": "^16.0.2",
    "eslint-friendly-formatter": "^4.0.1",
    "eslint-loader": "^4.0.2",
    "eslint-plugin-babel": "^5.3.1",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^5.1.0",
    "eslint-plugin-vue": "^7.9.0",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^5.3.1",
    "jest": "^26.6.3",
    "jest-serializer-vue": "^2.0.2",
    "mini-css-extract-plugin": "1.3.0",
    "moment": "^2.29.1",
    "node-notifier": "^9.0.1",
    "node-sass": "^5.0.0",
    "ora": "^5.4.0",
    "path-browserify": "^1.0.1",
    "portfinder": "^1.0.28",
    "postcss": "^8.2.13",
    "postcss-cli": "^8.3.1",
    "postcss-import": "^14.0.1",
    "postcss-loader": "^5.2.0",
    "postcss-url": "^10.1.3",
    "raw-loader": "^4.0.2",
    "rimraf": "^3.0.2",
    "sass-loader": "^11.0.1",
    "semver": "^7.3.5",
    "shelljs": "^0.8.4",
    "speed-measure-webpack-plugin": "^1.5.0",
    "terser-webpack-plugin": "^5.1.1",
    "url-loader": "^4.1.1",
    "v-calendar": "^1.0.8",
    "vue-jest": "^3.0.7",
    "vue-loader": "^15.9.6",
    "vue-server-renderer": "^2.6.12",
    "vue-style-loader": "^4.1.3",
    "vue-template-compiler": "^2.6.12",
    "vuex": "^3.6.2",
    "vuex-i18n": "^1.13.1",
    "vuex-router-sync": "^5.0.0",
    "webpack": "^5.35.0",
    "webpack-bundle-analyzer": "^4.4.1",
    "webpack-cli": "^4.6.0",
    "webpack-dev-server": "^3.11.2",
    "webpack-merge": "^5.7.3",
    "workbox-webpack-plugin": "^6.1.5"
  }

webpack.base.conf.js

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

module.exports = {
   plugins: [
     new VueLoaderPlugin(),
  ]
}

What is expected?

Building is successful

What is actually happening?

Got error while building: Vue loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
chenjiezicommented, Aug 17, 2022

Maybe you should try to remove “speed-measure-webpack-plugin”, i got the same trouble while upgrading webpack from v4.46.0 to v5.69.1,

But I need “speed measure webpack plugin”. I want to know how this problem is caused and how can I solve it? @anqanq000

1reaction
anqanq000commented, Feb 26, 2022

Maybe you should try to remove “speed-measure-webpack-plugin”, i got the same trouble while upgrading webpack from v4.46.0 to v5.69.1,

Read more comments on GitHub >

github_iconTop Results From Across the Web

vue-loader was used without the corresponding plugin #52
Trying to do the Single File Component section, and I'm getting this error and I try to do npm run build: ERROR in...
Read more >
vue-loader was used without the corresponding plugin ... - Qiita
Copied! vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.
Read more >
Getting Started - Vue Loader
The plugin is required! It is responsible for cloning any other rules you have defined and applying them to the corresponding language blocks...
Read more >
vue.js - Compile error [VueLoaderPlugin Error] vue-loader 15 ...
Apparently this has to do with laravel-mix . It uses it's own vue-loader conflicting with the one from vuetify-loader . In this way...
Read more >
How to resolve vue-loader error 'vue-loader was used without ...
vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config. In my webpack.config.js file, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found