Vite not reporting type errors in .vue files during dev / build

⚠️ IMPORTANT ⚠️ Please do not ignore this template. If you do, your issue will be closed immediately.

• Read the docs.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• This is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

Describe the bug

Type errors are not detected in .vue files, neither in dev mode (vite dev) nor when building (vite build).

Reproduction

• Create new vue-ts project using npm init @vitejs/app
• Modify src/components/HelloWorld.vue, add the following line:

let hello: boolean = "Hello"

Run vite dev: no error reported.

Run vite build: no error reported.

This is a duplicate of https://github.com/vitejs/vite/issues/749 which was closed.

System Info

• vite version: 2.1.0
• Operating System: Arch Linux
• Node version: v15.10.0
• Package manager (npm/yarn/pnpm) and version: 6.14.11

Logs (Optional if provided reproduction)

1. Run vite or vite build with the --debug flag.
2. Provide the error log here.

Buid log

$ npx vite build --debug
vite:config bundled config file loaded in 101ms +0ms
vite:config using resolved config: {
vite:config   plugins: [
vite:config     'alias',
vite:config     'vite:dynamic-import-polyfill',
vite:config     'vite:resolve',
vite:config     'vite:html',
vite:config     'vite:css',
vite:config     'vite:esbuild',
vite:config     'vite:json',
vite:config     'vite:wasm',
vite:config     'vite:worker',
vite:config     'vite:asset',
vite:config     'vite:vue',
vite:config     'vite:define',
vite:config     'vite:css-post',
vite:config     'vite:build-html',
vite:config     'commonjs',
vite:config     'vite:data-uri',
vite:config     'rollup-plugin-dynamic-import-variables',
vite:config     'vite:import-analysis',
vite:config     'vite:esbuild-transpile',
vite:config     'vite:terser',
vite:config     'vite:reporter'
vite:config   ],
vite:config   build: {
vite:config     target: [ 'es2019', 'edge16', 'firefox60', 'chrome61', 'safari11' ],
vite:config     polyfillDynamicImport: true,
vite:config     outDir: 'dist',
vite:config     assetsDir: 'assets',
vite:config     assetsInlineLimit: 4096,
vite:config     cssCodeSplit: true,
vite:config     sourcemap: false,
vite:config     rollupOptions: {},
vite:config     commonjsOptions: { include: [Array], extensions: [Array] },
vite:config     minify: 'terser',
vite:config     terserOptions: {},
vite:config     cleanCssOptions: {},
vite:config     write: true,
vite:config     emptyOutDir: null,
vite:config     manifest: false,
vite:config     lib: false,
vite:config     ssr: false,
vite:config     ssrManifest: false,
vite:config     brotliSize: true,
vite:config     chunkSizeWarningLimit: 500
vite:config   },
vite:config   define: { __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false },
vite:config   ssr: { external: [ 'vue', '@vue/server-renderer' ] },
vite:config   configFile: '/home/bart/sandbox/vite-project/vite.config.ts',
vite:config   inlineConfig: {
vite:config     root: undefined,
vite:config     base: undefined,
vite:config     mode: undefined,
vite:config     configFile: undefined,
vite:config     logLevel: undefined,
vite:config     clearScreen: undefined,
vite:config     build: {}
vite:config   },
vite:config   root: '/home/bart/sandbox/vite-project',
vite:config   base: '/',
vite:config   resolve: { dedupe: undefined, alias: [ [Object] ] },
vite:config   publicDir: '/home/bart/sandbox/vite-project/public',
vite:config   command: 'build',
vite:config   mode: 'production',
vite:config   isProduction: true,
vite:config   optimizeCacheDir: '/home/bart/sandbox/vite-project/node_modules/.vite',
vite:config   server: {},
vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
vite:config   assetsInclude: [Function: assetsInclude],
vite:config   logger: {
vite:config     hasWarned: false,
vite:config     info: [Function: info],
vite:config     warn: [Function: warn],
vite:config     error: [Function: error],
vite:config     clearScreen: [Function: clearScreen]
vite:config   },
vite:config   createResolver: [Function: createResolver]
vite:config } +3ms
vite v2.1.0 building for production...
✓ 15 modules transformed.
dist/assets/logo.03d6d6da.png    6.69kb
dist/index.html                  0.47kb
dist/assets/index.3b597bd0.css   0.34kb / brotli: 0.18kb
dist/assets/index.77a107c9.js    2.14kb / brotli: 0.92kb
dist/assets/vendor.6801b2a0.js   42.65kb / brotli: 15.36kb

[Shinigami92]

As Evan already said:

During dev, your IDE should already report the errors.

[kikyous]

@yyx990803 type checking in IDE is not enough, I think we need a plugin like https://github.com/TypeStrong/fork-ts-checker-webpack-plugin