vuejs / create-vue

🛠️ The recommended way to start a Vite-powered Vue project
Other
3.8k stars 432 forks source link

TypeScript based setup not working (no type checking) #527

Closed dumptyd closed 5 months ago

dumptyd commented 5 months ago

Describe the bug

TypeScript based setup does not provide type checking

Expected behavior

Typescript works.

How to reproduce

npm create vue@latest

✔ Project name: … vue-project ✔ Add TypeScript? … Yes ✔ Add JSX Support? … No ✔ Add Vue Router for Single Page Application development? … No ✔ Add Pinia for state management? … No ✔ Add Vitest for Unit Testing? … No ✔ Add an End-to-End Testing Solution? › No ✔ Add ESLint for code quality? … Yes ✔ Add Prettier for code formatting? … No ✔ Add Vue DevTools 7 extension for debugging? (experimental) … No


In any .vue or .ts file, add something like this

const a: Record<string, number> = '1';
console.log(a);

and run npm run lint. This is not getting flagged. Other than that, props, setup-variables, undefined variables/imports are not getting type-checked/flagged either.

For whatever reason, @typescript-eslint/no-unused-vars works correctly though.

Yordan-Ramchev commented 5 months ago

For type checking, use "type-check": "vue-tsc --build --force" command.

Reference:

If using SFCs, use the vue-tsc utility for command line type checking and type declaration generation. vue-tsc is a wrapper around tsc, TypeScript's own command line interface. It works largely the same as tsc except that it supports Vue SFCs in addition to TypeScript files. You can run vue-tsc in watch mode in parallel to the Vite dev server, or use a Vite plugin like vite-plugin-checker which runs the checks in a separate worker thread.

cexbrayat commented 5 months ago

As @Yordan-Ramchev mentioned, the TypeScript compilation is done via npm run type-check not via npm run lint. If your IDE does not flag these issues, it's probably because you did not add the Vue (for vue/ts issues) and ESLint (for linting issues) plugins.

I'll close this issue. If you still think this is a problem with create-vue, please provide a repro using Stackblitz and I'll gladly re-open and look into it.