fix(ts): prevent checking types twice in modern mode & use consola as logger (#4803)

packages/webpack/src/config/client.js

@@ -136,7 +136,7 @@ export default class WebpackClientConfig extends WebpackBaseConfig {
 
     // TypeScript type checker
     // Only performs once per client compilation and only if `ts-loader` checker is not used (transpileOnly: true)
-    if (this.loaders.ts.transpileOnly && this.options.build.useForkTsChecker) {
+    if (!this.isModern && this.loaders.ts.transpileOnly && this.options.build.useForkTsChecker) {
       const forkTsCheckerResolvedPath = this.nuxt.resolver.resolveModule('fork-ts-checker-webpack-plugin')
       if (forkTsCheckerResolvedPath) {
         const ForkTsCheckerWebpackPlugin = require(forkTsCheckerResolvedPath)
@@ -145,7 +145,8 @@ export default class WebpackClientConfig extends WebpackBaseConfig {
           tsconfig: path.resolve(this.options.rootDir, 'tsconfig.json'),
           // https://github.com/Realytics/fork-ts-checker-webpack-plugin#options - tslint: boolean | string - So we set it false if file not found
           tslint: (tslintPath => fs.existsSync(tslintPath) && tslintPath)(path.resolve(this.options.rootDir, 'tslint.json')),
-          formatter: 'codeframe'
+          formatter: 'codeframe',
+          logger: consola
         }, this.options.build.useForkTsChecker)))
       } else {
         consola.warn('You need to install `fork-ts-checker-webpack-plugin` as devDependency to enable TypeScript type checking !')

test/unit/typescript.modern.test.js

@@ -0,0 +1,25 @@
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'
+import { loadFixture, Nuxt, Builder, BundleBuilder } from '../utils'
+
+jest.mock('fork-ts-checker-webpack-plugin')
+
+describe('typescript modern', () => {
+  let nuxt
+
+  beforeAll(async () => {
+    process.env.NUXT_TS = 'true'
+    const options = await loadFixture('typescript')
+    nuxt = new Nuxt(Object.assign(options, { modern: true }))
+    await new Builder(nuxt, BundleBuilder).build()
+    delete process.env.NUXT_TS
+  })
+
+  test('fork-ts-checker-webpack-plugin', () => {
+    expect(ForkTsCheckerWebpackPlugin).toHaveBeenCalledTimes(1)
+  })
+
+  // Close server and ask nuxt to stop listening to file changes
+  afterAll(async () => {
+    await nuxt.close()
+  })
+})