Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Versions of vue-loader 16.6.0+ issues compile time error while using with vue-svg-loader #1879

Closed
jskitz opened this issue Sep 24, 2021 · 4 comments

Comments

@jskitz
Copy link

jskitz commented Sep 24, 2021

Version

16.6.0+

Reproduction link

github.com

Steps to reproduce

  • Pull down the repository by issuing the command git clone git@github.com:jskitz/vue-loader-bug.git
  • npm install to install the packages.
  • Try to serve the project running npm run serve. You will receive a compile time error that complains of a module parse failure.

The problem occurs in vue-loader versions 16.6.0+ and above. If you want to fix the problem in this repository, you can install version 16.5.0 and everything will work fine.

If you want to see this running correctly, downgrade vue-loader to 16.5.0:

  • npm install vue-loader@16.5.0, which will downgrade vue-loader from 16.8.1 to 16.5.0
  • npm run serve
  • Go to http://localhost:8080/ and you will see an SVG of a girl reading a book.

What is expected?

It is expected that this should compile correctly with later versions of vue-loader instead of receiving a compile time error.

What is actually happening?

In versions greater than 16.5.0, the following compile time error is received:

Module parse failed: Unexpected token (1:0)
File was processed with these loaders:
 * ./node_modules/vue-loader/dist/index.js
 * ./node_modules/vue-svg-loader/index.js
You may need an additional loader to handle the result of these loaders.

Stack trace:

@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/GirlReadingIllustration.vue?vue&type=script&lang=js 1:0-70 4:29-52
 @ ./src/components/GirlReadingIllustration.vue?vue&type=script&lang=js
 @ ./src/components/GirlReadingIllustration.vue
 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/App.vue?vue&type=script&lang=js
 @ ./src/App.vue?vue&type=script&lang=js
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.0.143:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

Because I've migrated my project to vue-3 and versions are updating quickly, I'm trying to stay up to date as much as possible. When upgrading vue-loader from 16.5.0 to 16.8.1, I started getting compile time errors when compiling all svg files in my project.

@seeyoulater
Copy link

seeyoulater commented Sep 24, 2021

I have the same problem. The reason is that vue-loader doesn't anymore process files without .vue or .html extensions.
Not enough flexible workaround for ts-loader that causes a bug. Would be nice to have a way to process custom files too.

@frankykubo
Copy link

Any update on this?

@sodatea
Copy link
Member

sodatea commented Oct 12, 2021

Any update on this?

"help wanted".

@sodatea
Copy link
Member

sodatea commented Oct 26, 2021

Fixed in v16.8.2

@sodatea sodatea closed this as completed Oct 26, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants