Vize

Type Checking

vize check type-checks .vue, .ts, .tsx, and .d.ts files in one project-wide pass. It is the Vize counterpart of vue-tsc --noEmit: it reports the same TypeScript diagnostics (with the same TS#### codes), pointing at the line in your .vue file.

Note

Type checking is part of the alpha. Run it next to your current vue-tsc command and compare the results on your project before you replace the CI step. See Stability.

Run it

In a Vite+ project that uses the Vize helper, run the generated task:

vp run typecheck

Without Vite+, install the vize package and run the command directly. The package already includes TypeScript's native compiler for your platform, so there is nothing else to install.

vp install -D vize
vp exec vize check

With no arguments, vize check reads files, include, and exclude from the nearest tsconfig.json. Pass paths or a different project to narrow the run:

vize check src
vize check --tsconfig tsconfig.app.json

What the output looks like

Given this component:

<script setup lang="ts">
const props = defineProps<{ step: number }>();
const emit = defineEmits<{ change: [value: number] }>();
</script>

<template>
  <button @click="emit('change', props.step.toFixed())">{{ props.stepp }}</button>
</template>

vize check reports both template mistakes at their source position:

src/Counter.vue
  error:7:34 [TS2345] Argument of type 'string' is not assignable to parameter of type 'number'.
  error:7:66 [TS2551] Property 'stepp' does not exist on type ... Did you mean 'step'?

✗ Type checked 1 files in 487.30ms
  2 error(s)

The exit code is non-zero when there are errors, so the command can gate CI as is. Use --format json for machine-readable output and --max-warnings 0 to fail on warnings too.

What gets checked

Area Checked by default Turn off with
<script> and <script setup> code Yes Exclude the file in tsconfig
Template expressions and bindings Yes --no-check-template-bindings
Props passed to child components Yes --no-check-props
Emitted events and their payloads Yes --no-check-emits
Options API template bindings (data, computed, methods, ...) Yes vue.typeChecker.optionsApi: false
Plain .ts / .tsx / .d.ts files Yes Exclude the file in tsconfig

The same switches are available in vite.config.ts:

import { defineConfig } from "@vizejs/vite-plugin/vite-plus";

export default defineConfig({
  vue: {
    typeChecker: {
      checkProps: true,
      checkEmits: true,
      checkTemplateBindings: true,
      optionsApi: true,
    },
  },
});

Set vue.typeChecker.enabled: false to leave type checking to your current tool. The same vue section works with the plain Vite plugin; see the configuration reference for every key.

Global types and auto-imports

Vize only sees what your TypeScript project sees. Globals added through declare module "vue", and generated files such as auto-imports.d.ts or components.d.ts, must be matched by the include globs of the tsconfig.json you check:

{
  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "src/**/*.d.ts"]
}

Tip

If $t, $route, or an auto-imported component shows up as "does not exist", the declaration file is usually outside include. Add it there, or point --tsconfig at the project that has it.

Coming from vue-tsc

You use today With Vize
vue-tsc --noEmit vize check
vue-tsc -p tsconfig.app.json --noEmit vize check --tsconfig tsconfig.app.json
vue-tsc --declaration --emitDeclarationOnly vize check --declaration --declaration-dir dist/types
Vue - Official extension diagnostics Vize language server with typecheck enabled

The checker runs on TypeScript 7's native compiler (the Go port, also called Project Corsa), while vue-tsc runs on the JavaScript compiler. The type checker benchmark shows the measured difference. Diagnostics can still differ in edge cases, which is why the migration guide asks you to compare before switching.

Debugging a diagnostic

Vize turns each SFC into virtual TypeScript before checking it. When a diagnostic looks wrong, look at that generated code:

vize check --show-virtual-ts src/components/Counter.vue

--save-virtual-ts-for <file> writes it next to the component instead, and --profile writes timings and all virtual files under node_modules/.vize. Include the output when you report a bug.

Speed on large projects

vize check splits independent parts of the import graph across several native TypeScript processes and picks the count from your CPU and file count. If memory is tight or you need stable ordering, use one process:

vize check --servers 1

Type-check performance covers profiling and tuning in detail. For fast repeated runs during development, keep a server running (Unix only) and point checks at it:

vize check-server --socket /tmp/vize-check.sock
vize check --socket /tmp/vize-check.sock src

Try the experimental tsrs backend

Vize can use tsrs as the native TypeScript runtime for checks, type-aware lint rules, and editor features. The integration is experimental because tsrs follows a TypeScript 7.1 development snapshot and its language server and Node API are still marked incomplete or unstable upstream.

Install tsrs in the project and select its launcher explicitly:

vp install -D tsrs
vize check --tsrs-path node_modules/.bin/tsrs

The equivalent shared configuration is:

export default defineConfig({
  vue: {
    typeChecker: {
      tsrsPath: "node_modules/.bin/tsrs",
    },
  },
});

TSRS_PATH and TSRS_EXECUTABLE are also supported. Vize resolves the JavaScript launcher to tsrs's platform binary when one is available, so a standalone Vize executable does not need Node.js to start the checker. Keep the package version pinned while evaluating it: compiler version drift can change which TypeScript diagnostics a project receives.

Vize currently exercises tsrs through its compiler and --lsp protocols. The upstream --init and --showConfig commands are outside this integration, and tsrs 0.18.0 does not publish Windows or Intel macOS native packages. Compare CLI and editor diagnostics with the default backend before adopting it in CI.