Cannot read property 'styles' of undefined

[candisecandise]

Version

17.0.0

Reproduction link

Steps to reproduce

I wanted to create a vue project with webpack. I installed vue@2, version was 2.7.0, but I installed the lastest vue-loader, version was 17.0.0. Then I ran webpack-dev-server --mode development, I got an error:

ERROR in ./src/App.vue
Module build failed (from ./node_modules/vue-loader/dist/index.js):
TypeError: Cannot read property 'styles' of undefined
    at Object.loader (/Users/admin/xxx/node_modules/vue-loader/dist/index.js:70:34)
 @ ./src/main.js 2:0-28 6:17-20

Is it vue@2 cannot be used with vue-loader@17?

What is actually happening?

My project ran failed.

Thanks~

[vue-bot]

Hello, thank you for taking time filling this issue!

However, we kindly ask you to use our Issue Helper when creating new issues, in order to ensure every issue provides the necessary information for us to investigate. This explains why your issue has been automatically closed by me (your robot friend!).

I hope to see your helper-created issue very soon!

[bpossolo]

@candisecandise I'm experiencing this same thing as well using

• vue 2.7.0
• vue-loader 16.8.3
• typescript 4.7.4
• sass-loader 11.0.1
• css-loader 5.2.4

I removed my dependency on vue-template-compiler as mentioned in step 2 of the upgrade guide.

here is the relevant part of my webpack config

{
  test: /\.ts$/,
  loader: 'ts-loader',
  exclude: /node_modules/,
  options: {
    appendTsSuffixTo: [/\.vue$/]
  }
},
{
  test: /\.vue$/,
  loader: 'vue-loader'
},
{
  test: /\.scss$/,
  use: [
    'style-loader',
    'css-loader',
    'sass-loader',
  ]
}

I wouldn't recommend using vue-loader 17 because the changelog says it requires vue 3

[bpossolo]

I tried downgrading to some earlier versions of vue-loader:

• 16.8.3
• 16.8.2
• 16.8.1
• 16.8.0
• 16.7.1

none of them work with vue 2.7.0

[bpossolo]

@yyx990803 it appears this issue may actually be valid however it got auto-closed by the bot...

[bpossolo]

@candisecandise I managed to get vue 2.7.0 to work with vue-loader 15.10.0 🎉 I also no longer have explicit dependency on vue-template-compiler in my package.json fwiw

upon closer inspection of the 2.7.0 upgrade guide, I see it explicitly says to use 15.10.0 It might be useful to post somewhere on vue-loader docs that 16 and 17 are for vue 3 if that's the case

[candisecandise]

@candisecandise I managed to get vue 2.7.0 to work with vue-loader 15.10.0 🎉 I also no longer have explicit dependency on vue-template-compiler in my package.json fwiw

upon closer inspection of the 2.7.0 upgrade guide, I see it explicitly says to use 15.10.0 It might be useful to post somewhere on vue-loader docs that 16 and 17 are for vue 3 if that's the case

@bpossolo Thank you so much! You are really attentive~, I didn't think to check the upgrade guide for 2.7.0 at all... May i ask where did you find it? I still couldn't find it... But as you said, the readme of vue-loader should add some instructions, only vue 3 can support 16 and 17@yyx990803

[bpossolo]

Here is the upgrade guide/post

https://blog.vuejs.org/posts/vue-2-7-naruto.html

i can’t remember if I found it on the VueJS Twitter account or if it was directly on the vue blog.

[candisecandise]

Here is the upgrade guide/post

https://blog.vuejs.org/posts/vue-2-7-naruto.html

i can’t remember if I found it on the VueJS Twitter account or if it was directly on the vue blog.

@bpossolo Got it, thank you again~