CODEWITHSUNDEEP
vue.jsnpmnpm-install
gokul_santhosh
gokul_santhosh

Reputation: 303

Error : vue-loader requires @vue/compiler-sfc to be present in the dependency tree

I'm getting this error when I'm trying to do

npm run serve

I have tried npm update sudo npm serve. It didn't work. I also tried deleting the package-lock.json file and doing npm install after that, and that too didn't work. I also downgraded the version of the vue-loader to 15.9.2 and that also didn't work

Upvotes: 14

Views: 31997

Answers (8)

Muhammad Numan
Muhammad Numan

Reputation: 249

You can also solve it by the following steps:

npm update

then use

npm i @vue/compiler-sfc

Upvotes: 1

Alexander Shkirkov
Alexander Shkirkov

Reputation: 3857

Most likely, your problem has already been solved in one of the previous answers. But there is another least likely option in which you will receive a similar error.

The problem is in... node / npm versions. Possibly, some (non-LTS?) node/npm versions generates not quite correct dependency tree, and then trying to build unnecessary sources.

We got this error in one of our projects, when Jenkins built it on node v11.14.0 and npm 6.7.0. But same sources are built OK on node v8.16.0 / npm 6.4.1, node v10.18.0 / npm 6.13.4 and node v14.16.0 / npm 7.8.0. We had to update node and npm to fix this issue.

Please, use this answer only as a "last chance". No need to update/rollback your node/npm environment immediately when you see this error.

Upvotes: 2

Fernando Gonzalez
Fernando Gonzalez

Reputation: 811

For us, the ones using VueJs 2!

Remember vue-loader@16 is only for VueJs 3.

Check the releases log here.

I downgrade to the v15.9.7. It is working fine.

If you are using Dependabot, can add the a ignore rule to avoid v16 PRs:

ignore:
  - dependency-name: "vue-loader"
    versions: ["16.x"]

Upvotes: 4

Johannes
Johannes

Reputation: 417

This is a new thing in vue-loader@16. To fix this, assuming you are using Vue 2, you should downgrade:

yarn add vue-loader@15

Note that you also need vue-template-compiler, the same version as the version of Vue you are using.

Upvotes: 5

Kenedy Nopriansyah
Kenedy Nopriansyah

Reputation: 739

you can do this and this works for me

vue-loader@15.9.7
vue-template-compiler@2.6.1

Upvotes: 3

Oytunistrator
Oytunistrator

Reputation: 11

I get an error when I install it directly. but it worked when I forced it.;

npm i @vue/compiler-sfc --force

Upvotes: 1

Benny K
Benny K

Reputation: 1247

For those running into this with Vue 3 and Yarn Berry, keep in mind that Vue 3 plugins are still not compatible with Yarn 2.*, so you'd have to update vue-loader section in your .yarnrc.ymlas follows:

  vue-loader@*:
    peerDependencies:
      '@vue/compiler-sfc': '*'
      webpack: '*'

Upvotes: 1

Falyoun
Falyoun

Reputation: 3976

Actually, you are missing the library so you just have to install it with

npm i @vue/compiler-sfc

Upvotes: 21

Related Questions