vuejs/vue-cli

Type checking ignores script-setup blocks

Open

#6716 opened on Oct 1, 2021

View on GitHub
 (13 comments) (0 reactions) (0 assignees)JavaScript (29,754 stars) (6,328 forks)batch import
help wanted

Description

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.

Contributor guide

Tech stack
vuetypescriptjavascriptnodejs
Domain
frontendclibuild system
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Vue script setup syntaxTypeScript basicsVue CLI project structure
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
45
Research direction
Investigate how @vue/cli plugin typescript handles type checking for <script setup> blocks. Examine the webpack config and vue loader options in the reproduction repo. Check if the issue is related to the lang attribute being ignored. Look at comments in the issue for attempted solutions.