Different Type Errors between webpack compile and vue-tsc lint

[janwidmer]

Hi There,

I am trying to setup a vue project with vue-3 and typescript. Development and Build is done with the following chain:

1. vue-loader
2. ts-loader (transpileOnly)
3. babel-loader

For linting during webpack dev / build, I use https://github.com/TypeStrong/fork-ts-checker-webpack-plugin.

The config is:

new ForkTsCheckerWebpackPlugin({
      // don't block webpack's emit to wait for type checker in development mode, errors only visible inside CLI
      async: !isProduction,
      typescript: {
        diagnosticOptions: {
          semantic: true,
          syntactic: true,
        },
        extensions: {
          vue: {
            enabled: true,
            compiler: '@vue/compiler-sfc'
          }
        },
        // Set the tsconfig.json path
        configFile: './tsconfig.json',
      },
      eslint: {
        files: './src/**/*.{ts,js}' // required - same as command `eslint ./src/**/*.{ts,tsx,js,jsx} --ext .ts,.tsx,.js,.jsx`
      },
    }),

This setup works so far. No I am trying to setup lint-staged and es-lint to work also for my vue sfc files. I added your plugin to my setup.

My Problem is now, that I get different type errors when running my webpack build (no errors) and a bunch of errors, when running vue-tsc --noEmit.

My TsConfig:

{
  "compilerOptions": {
    "target": "es2019",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "resolveJsonModule": true,
    "sourceMap": true,
    "baseUrl": ".",
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": ["es2015", "es2016", "es2017", "es2018", "dom"]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}

I assume, that this is caused by the different tools using different typescript options?

Do you have any idea / input? Is vue-tsc automatically using my tsconfig.json from the project root?

[johnsoncodehk]

It seem is a similar problem to #77? Can you try use --project flag to a definite tsconfig?