fi3ework / vite-plugin-checker

💬 Vite plugin that provide checks of TypeScript, ESLint, vue-tsc, Stylelint and more.
https://vite-plugin-checker.netlify.app
MIT License
1.01k stars 88 forks source link

Typescript reports 0 erros #382

Open PLkolek opened 3 months ago

PLkolek commented 3 months ago

Describe the bug

After bootstrapping a Vite react-ts project and following vite-plugin-checker's "Getting Started" to set up Typescript checker, the checker seems to execute Typescript, but for some reason it doesn't detect any errors. I.e. running npm run build fails due to type errors, but npm run dev outputs [TypeScript] Found 0 errors. Watching for file changes.

I using WSL on Windows - maybe this is what matters?

Reproduction

  1. npm create vite@latest my-react-app -- --template react-ts
  2. cd my-react-app
  3. npm i vite-plugin-checker -D
  4. Import and use checker in vite.config.ts with typescript: true
  5. Introduce type error in src/App.tsx
  6. npm run dev

Expected behavior

Expected result: same error as when executing npm run build.

src/App.tsx:21:41 - error TS2345: Argument of type '(count: number) => string' is not assignable to parameter of type 'SetStateAction<number>'.
  Type '(count: number) => string' is not assignable to type '(prevState: number) => number'.
    Type 'string' is not assignable to type 'number'.

21         <button onClick={() => setCount((count) => "123")}>

Actual result: no errors detected.

  VITE v5.4.0  ready in 435 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

[TypeScript] Found 0 errors. Watching for file changes.

System Info

System:
    OS: Linux 5.10 Ubuntu 20.04 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz
    Memory: 5.04 GB / 7.69 GB
    Container: Yes
    Shell: 5.0.16 - /bin/bash
  Binaries:
    Node: 20.13.1 - ~/.nvm/versions/node/v20.13.1/bin/node
    npm: 10.5.2 - ~/.nvm/versions/node/v20.13.1/bin/npm
  npmPackages:
    vite-plugin-checker: ^0.7.2 => 0.7.2

Additional context

No response

Validations

PLkolek commented 3 months ago

Ah I see now. The project generated by npm create vite@latest my-react-app -- --template react-ts uses references, and AFAIU this requires buildMode: true. As I haven't worked with TS for a longer while I missed the whole references thing, and did not know what --build flag means ("why would I need to build anything if I am just running a checker?!"). Maybe the docs could be more explicit when this flag is needed, or that some Vite templates need this "advanced" option?

bungdanar commented 3 months ago

Ah I see now. The project generated by npm create vite@latest my-react-app -- --template react-ts uses references, and AFAIU this requires buildMode: true. As I haven't worked with TS for a longer while I missed the whole references thing, and did not know what --build flag means ("why would I need to build anything if I am just running a checker?!"). Maybe the docs could be more explicit when this flag is needed, or that some Vite templates need this "advanced" option?

I am still confused, I also use react-ts template, where should I set the buildMode: true or add the --build flag? The vite-plugin-checker doesn't have buildMode option but enableBuild. I have already set enableBuild: true but it still show 0 errors when in the development mode.

mice33 commented 3 months ago

Ah I see now. The project generated by npm create vite@latest my-react-app -- --template react-ts uses references, and AFAIU this requires buildMode: true. As I haven't worked with TS for a longer while I missed the whole references thing, and did not know what --build flag means ("why would I need to build anything if I am just running a checker?!"). Maybe the docs could be more explicit when this flag is needed, or that some Vite templates need this "advanced" option?

I am still confused, I also use react-ts template, where should I set the buildMode: true or add the --build flag? The vite-plugin-checker doesn't have buildMode option but enableBuild. I have already set enableBuild: true but it still show 0 errors when in the development mode.

https://github.com/fi3ework/vite-plugin-checker/blob/b2c32367cf2e410154194d7730d8830aace898d9/docs/checkers/typescript.md?plain=1#L25

After adding buildMode: true, I fixed the issue.

terrance456 commented 1 month ago

Solution:

vite.config.ts file


 plugins: [
    checker({
      typescript: { buildMode: true },
    }),
  ]
crcass commented 1 week ago

If you're starting a new Vite project, the default tsconfig.json doesn't seem to work. Updating the config to point to tsconfig.app.json seems to fix the problem for me.

export default defineConfig({
  plugins: [
    react(),
    checker({ 
      typescript: {
        tsconfigPath: './tsconfig.app.json'
      },
     })
  ],
})