policyfly / vue-script-tsc

A lightning fast TypeScript type checker for Vue SFC Script tags

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Can I use this with vue-cli aka webpack?

johnnyshankman opened this issue · comments

How would I go about inserting type checking as a step before it tries to build?

There's no plugin for vue-cli but you can just run it before the build step. This is the same as would be done for Vite:

"scripts": {
  "build": "vue-script-tsc --root . && vue-cli-service build"
}

If you're doing that you may want to disable webpack's slow type checking too, as then you'll be running type checking twice, once with vue-script-tsc and then again in the build step because of fork-ts-checker-webpack-plugin. Here is mentioned one way to remove it though I have not tried it myself: vuejs/vue-cli#3157 (comment) (ignore the comment below saying not to do this, yes you're skipping type errors in webpack but that's because you're doing it elsewhere)

Let me know if this works and I can add a note in the README about this specific use case.

Ended up opting to just upgrade my scaffolding to using vite with the help of https://github.com/richardevcom/vite-vuex-tailwind but @BenShelton thank you, perfect answer. Vite allows me to use vite-plugin-cheker and pass in:

plugins: [
    vue(),
    checker({
      vueTsc: true,
      eslint: {
        lintCommand: 'eslint "./src/**/*.{ts,vue}"',
      },
    }),
  ],

so now i get vue-tsc on every run in dev hot reload and linting as well.

Nice! Glad you got it working, in that case I'm gonna close this issue.