Gatsby: bug(gatsby-plugin-typescript): linting causes errors

[cpboyd]

Description

PR #18721 seems to have broken my builds.

I get errors thrown at Typescript-specific keywords like enum and as, even though my eslint config doesn't throw any errors for those.

Reverting to [email protected] resolves these issues.

Steps to reproduce

Use [email protected] for any Typescript project containing Typescript files with enum or as.

Expected result

These previously compiled without issue.

Actual result

Crash on develop/build.

Environment

Run gatsby info --clipboard in your project directory and paste the output here.

  System:
    OS: macOS 10.15.3
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 13.8.0 - /usr/local/bin/node
    Yarn: 1.22.0 - /usr/local/bin/yarn
    npm: 6.14.1 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.122
    Safari: 13.0.5
  npmGlobalPackages:
    gatsby-cli: 2.9.0

[pvdz]

@ThewBear could you please look into this?

[ThewBear]

I couldn't reproduce. Could you give me an example code?

[cpboyd]

@ThewBear After trying to make a simplified reproduction, it seems like it only happens with theme workspaces. I'll try to get you a repro

[cpboyd]

@ThewBear here's a stripped down repro: https://github.com/cpboyd/gatsby-ts-workspace-bug

[LekoArts]

Also seeing the issue. You can clone https://github.com/LekoArts/gatsby-themes and run yarn and then yarn workspace minimal-blog develop and see a bunch of errors like:

 ERROR #98123  WEBPACK

Generating development JavaScript bundle failed


/mnt/c/Users/Lennart/Development/GitHub/gatsby-themes/themes/gatsby-theme-minimal-blog/src/hooks/use-site-metadata.tsx
  7:7  error  Parsing error: Unexpected token

   5 |     siteMetadata: {
   6 |       siteTitle: string
>  7 |       siteTitleAlt: string
     |       ^
   8 |       siteHeadline: string
   9 |       siteUrl: string
  10 |       siteDescription: string

✖ 1 problem (1 error, 0 warnings)

This completely brakes the development and I'll rollback for now.

[brycefranzen]

I'm having the same issue -- working in a mono repo with yarn workspaces. Worked on version 2.1.23. Any higher version, it fails during build/develop.

[wardpeet]

We reverted it in version [email protected] thanks for pointing this out! And sorry for the troubles ❤️

[pieh]

I was diving into this issue and here's gist of it:
eslint-config-react-app already adds .ts specific rules - that's why it worked nicely in non-workspaces examples. Problem is that the "criteria" for ts is **/*.ts?(x) ( https://github.com/facebook/create-react-app/blob/master/packages/eslint-config-react-app/index.js#L57 ) - the ** prefix seems to prevent it from matching files outside of project directories so it fails in workspaces scenario as themes directories are outside of site directory.

Potential fixes here (that would need to be done if we restore eslint loader for ts, as we reverted that part recently):

• make a PR to eslint-config-react-app to use just *.ts?(x) pattern ( will need to go through history there to see if the **/ prefix is very intentional

[pieh]

I created PR for eslint-config-react-app ( https://github.com/facebook/create-react-app/pull/8666 ), will see if we can revert the revert / restore TS linting with workspaces support