Incorrectly parses non-XML-compliant template

[akoidan]

This template causes typescript error:

<template>
<img src="logo.png">
</template>

Note the image closing tag is missing, but it's still valid vue template. Things like linters inspire that syntax

ERROR in ./src/components/App.vue?vue&type=script&lang=ts& (../node_modules/babel-loader/lib??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/App.vue?vue&type=script&lang=ts&) Module build failed (from ../node_modules/babel-loader/lib/index.js): SyntaxError: /home/andrew/WebstormProjects/vue-webpack-typescript/src/components/App.vue: Unexpected token (32:10)

30 | }) 31 | export default class App extends Vue {

32 | private i: number = 0; | ^ 33 | private readonly a: number[] = []; 34 | 35 | private readonly id: string = 'App';

[pawelgabryelewicz]

Hi! Thank you for reporting this. Unfortunately, the official docs don't say which syntax must be used for the <template> section. In fact the XML parsing works fine - what you have mentioned as an example is not a valid XML - I guess it's SGML (which is a quite relaxed superset) and that kind of parser has to be used. At first glance I can't see any reasonable high-level parser written in JS (and I don't want to write one + don't want to rely on string replace method as well :D). I'll investigate if there is any suitable solution. I've stopped using vue recently so I may not be up to date - maybe this package is no longer required and the official vue-loader already covers this case?

[akoidan]

@pawelgabryelewicz well, I stuck to that issue for the second time, and it's really hard to track those errors, cause from the first look it seems like the cause should be in babel-loader.

• Maybe it's easier to check how vue-loader parses that thing? It seems like it splits the file to 3 sections (here's the source) and only then parses it as xml, which is more reasonable and should be faster than just parsing the whole text. Maybe make vue-loader as an optional dependency and rely on select-block exports?
• Or as a quick workaround, we might catch the exception so at least rethrow a meaningful error, cause other folks may just spend an enormous amount of time as I did for a simple tweak.
• If all of that is too much effort to spend, I would recommend at least to add a bold text in the README of this plugin that it requires a VALID XML template layout

[pawelgabryelewicz]

I have recently released version 1.1.1 which relies on internal vue-template-compiler - please check if the issue persists. Starting from now all the files that Vue is able to compile, should work here as well. It's not exactly the source that you mentioned, but that was a good point to start with. Thanks for your contribution and your time. Sorry for the delay, this is a very side project.