Vue "vue-tsc" Type Error - Fix in CI

By Kaveh Alemi·Latchkey

vue-tsc type-checks SFC scripts and templates. The dev server transpiles without type checking, so errors only appear when vue-tsc runs in CI.

What this error means

The typecheck step fails with a TSxxxx error inside a .vue file, often a prop or template binding type mismatch.

src/components/User.vue:12:20 - error TS2322: Type 'string' is not
assignable to type 'number'.

12   <UserCard :age="user.name" />
                    ~~~

Diagnose it: config resolution and version drift

Lint failures that appear only in CI are almost always a different linter version or a different resolved configuration, not new violations in the code.

npx eslint --version
npx eslint --print-config path/to/file.ts | head -40
npx eslint --debug path/to/file.ts 2>&1 | grep -i "config" | head

Common causes

Type checking only runs in CI

Local dev skips type checking, so a mismatch sits unnoticed until vue-tsc runs.

Prop/binding type mismatch

A template binds a value whose type does not match the declared prop.

How to fix it

Fix the type at the binding

1. Pass a value of the declared type, or correct the prop type.

<UserCard :age="user.age" />

Run vue-tsc locally

1. Add a typecheck script and run it before pushing.

vue-tsc --noEmit

How to prevent it

• Run vue-tsc --noEmit locally and in a pre-push hook.
• Type component props explicitly so mismatches are caught.

Frequently asked questions

Related guides

References

• Node.js documentation
• npm CLI documentation
• GitHub Actions documentation