prograhammer / vscode-tslint-vue

TSLint for Visual Studio Code and VueJS
Other
65 stars 6 forks source link

Wrong: Missing semicolon (semicolon) warning #15

Open DerAlbertCom opened 6 years ago

DerAlbertCom commented 6 years ago

When a .vue template is missing the the ts-line-vue has false positive warnings

grafik

expected behavior is no warnings in that case, like here

grafik

jgalentine007 commented 6 years ago

I noticed the same thing when I just spun up a template project with vue-cli 3.0. Which I guess is just a requirement (as listed on the quickstart.)

ffxsam commented 6 years ago

I'm experiencing this too, and it's driving me mad. I think I need to remove the extension.

justindeng0405 commented 6 years ago

I noticed the same thing too. If I disable the extension, I can't find another one to lint Vue SFC.

ffxsam commented 6 years ago

Fixed it.

Turns out I had some bad code. Make sure that:

  1. all your SFCs are <script lang="ts">. I had mixed script blocks, some just plain JS. This was causing issues. And BTW, this is not a bug with this extension, but rather VS Code's parser, it seems.
  2. you don't have any type errors anywhere else. Sometimes it seems like there's a domino effect and it wreaks havoc in the project.
Nfinished commented 6 years ago

Happens even in an SFC without script tags.

ex

ffxsam commented 6 years ago

@Nfinished Right. There's nothing wrong with this file, obviously, but it's other files affecting this one. (see my post above yours)

Nfinished commented 6 years ago

𝓬𝓻𝓲𝓹𝓮𝓼

ffxsam commented 6 years ago

I know, tell me about it. I spent hours trying to figure out what was wrong. I still don't understand why having some components use JS and some use TS is a problem. But it was causing issues in VS Code, as Prettier wouldn't work either.

ffxsam commented 6 years ago

I will say this, though: it's not possible to have a .vue file without a <script> block. I have to add <script lang="ts"></script> just to shut up the "missing semicolon" bug.

@prograhammer Is this something you could address?

ffxsam commented 6 years ago

Woops. Actually, all this code was needed:

<script lang="ts">
import Vue from 'vue';
export default Vue.extend();
</script>

Otherwise, main.ts was yelling at me because it didn't like App.vue being imported.

romansp commented 5 years ago

I use this extension together with eslint-plugin-vue and eslint to get template linting in .vue files. I have vue/html-self-closing enabled.

It works fine most of the time, but as soon as you have a component with self-closing <textarea /> or <iframe /> (maybe some other tags) it will start reporting [tslint] Missing semicolon (semicolon). Auto-fixing further will break syntax.

Before:

<template>
  <textarea />
</template>

<script lang="ts">
import Vue from "vue";
export default Vue.extend({});
</script>

After:

<template>
  <te"vue"a />
</template>

<;script lang="ts">
import Vue from "vue";
export default Vue.extend({});
</script>

After it becomes very annoying I temporarily disable auto-fixing, or execute VSCode's save without formatting.