Type checking ignores script-setup blocks

[bodograumann]

Version

5.0.0-beta.4

Reproduction link

github.com

Environment info

  System:
    OS: Linux 5.14 Arch Linux
    CPU: (4) x64 Intel(R) Core(TM) i5-7200U CPU @ 2.50GHz
  Binaries:
    Node: 16.10.0 - /usr/bin/node
    Yarn: 1.22.4 - ~/.local/bin/yarn
    npm: 7.24.1 - /usr/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: 92.0.1
  npmGlobalPackages:
    @vue/cli: 5.0.0-beta.4

Steps to reproduce

vue create vue-cli-script-setup-lang-ts-typechecks -bi '{
      "useConfigFiles": false,
      "plugins": {
        "@vue/cli-plugin-typescript": {
          "classComponent": false
        }
      },
      "vueVersion": "3"
    }'
cd vue-cli-script-setup-lang-ts-typechecks

Add some wrongly typed code. E.g.:

echo '<script setup lang="ts">const x: string = 42;</script>' >> src/App.vue

Build

npm run build

What is expected?

The typescript error is detected and the build fails.

What is actually happening?

The typing is simply stripped and no error can be seen.

[curly210102]

@sodatea This issue and #6736 are related to fork-ts-checker-webpack-plugin, ts-checker doesn't support <script setup> yet, I've submitted an issue and waiting for reply.

But think a little further, is it better to create Vue3 project with vue-cli-plugin-vite? Vite can provide long-term support for Vue3.

[screetBloom]

I noticed this problem too and saw your issue in fork-ts-checker-webpack-plugin
Maybe we can try to fix it if there is no progress in the near future

[screetBloom]

Using vue-cli-plugin-vite as the default startup dependency is not a good idea

We are currently using vite in the dev mode and use vue cli in the build mode, and there are still a lot of problems with vite that are hard to solve (but webpack is fine)

So what I suggest is that users should install this vue-cli-plugin-vite plugin manually

[curly210102]

@screetBloom Thanks for reply.

That's what I've been wondering about lately: the current role of vite and vue-cli. Based on some understanding of your answer, although vite's build mode relies on rollup, but there still a cost of migrating from webpack to rollup in real-world projects.

there are still a lot of problems with vite that are hard to solve (but webpack is fine)

[batuotasis]

any progress on this?

[bodograumann]

Please update to https://github.com/TypeStrong/fork-ts-checker-webpack-plugin/releases/tag/v6.4.1 where the issue is fixed.

[screetBloom]

There still seems to be some problems, I will comment under the #676

[screetBloom]

Ok, then this issue can be closed

[bodograumann]

No. While it worked for me, others are still reporting uncovered edge cases.
I think we should do the update in vue-cli, but this issue needs to stay open until everything is covered.

[screetBloom]

it worked for me too, then it can be closed first, for unknown case maybe can add another issue 😄

[victorgarciaesgi]

Hi! Sorry to reopen, I have this problem with Vue 3 and script setup not showing typescript errors on console. I tried forcing fork-ts-checker version with pnpm but no changes. Did you manage to resolve it?

[bodograumann]

The first try to solve this in fork-ts-checker-webpack-plugin was reverted and no further attempt has been made afaict.
I have switched to vite since and am using vue-tsc there anway. I think vue-tsc also works in vue-cli context as a workaround. Just has to be triggered manually. @victorgarciaesgi

[victorgarciaesgi]

Thanks @bodograumann ! Decided to use vue-tsc --watch for dev mode too it works great!