Skip to content
This repository has been archived by the owner on Jan 26, 2019. It is now read-only.

fork-ts-checker-webpack-plugin crashes with "Invalid source file:" #245

Open
jonathaningram opened this issue Jan 31, 2018 · 12 comments
Open

Comments

@jonathaningram
Copy link

jonathaningram commented Jan 31, 2018

Originally wrongly reported here: #238 (comment)

Is this a bug report?

Yes. Edit: I originally thought this was a cra-ts bug, but it appeared that I had a bad tsconfig.json file.

Can you also reproduce the problem with npm 4.x?

Using yarn not npm.

Environment

  1. npm ls react-scripts-ts: react-scripts-ts@2.13.0
  2. node -v: v9.4.0
  3. npm -v: 5.6.0 (don't use npm though)
  4. yarn --version: 1.3.2

Steps to Reproduce

  1. Can be reproduced with https://github.com/govau/cloud.gov.au/tree/cra-ts-fail/www/ui
  2. Directly in that folder you can run yarn install and then yarn start.
  3. Open up a src file like App.tsx. Press save in your editor and watch it crash.
Compiling...
/Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/service.js:22
        throw error;
        ^

FatalError: 
Invalid source file: /Users/me/my-app/www/ui/src/twirp.ts. Ensure that the files supplied to lint have a .ts, .tsx, .d.ts, .js or .jsx extension.
                
    at new FatalError (/Users/me/my-app/www/ui/node_modules/tslint/lib/error.js:27:28)
    at Linter.getSourceFile (/Users/me/my-app/www/ui/node_modules/tslint/lib/linter.js:222:23)
    at Linter.lint (/Users/me/my-app/www/ui/node_modules/tslint/lib/linter.js:96:31)
    at /Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/IncrementalChecker.js:142:30
    at WorkSet.forEach (/Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/WorkSet.js:17:13)
    at IncrementalChecker.getLints (/Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/IncrementalChecker.js:139:17)
    at run (/Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/service.js:15:29)
    at process.<anonymous> (/Users/me/my-app/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/service.js:38:5)
    at process.emit (events.js:160:13)
    at emit (internal/child_process.js:790:12)

After the first load, this happens every time I save a file and the app tries to reload.

I've tried react-scripts-ts@2.8.0 and that version does not have this issue.

Any ideas?

@DorianGrey
Copy link
Collaborator

DorianGrey commented Feb 1, 2018

The fork-ts-checker-webpack-plugin was introduced after 2.8.0, so that's normal.

I've tracked this down a bit, and figured out that the files from the src directory are not tracked as included in the typescript program instance shared between the type checker and the linter:

File to lint: /home/linne/Projects/cloud.gov.au/www/ui/src/App.tsx
Attempting to load file: /home/linne/Projects/cloud.gov.au/www/ui/src/App.tsx
Source files from program: [ '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.dom.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es5.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.reflect.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.proxy.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.iterable.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.symbol.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.promise.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.generator.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.collection.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/typescript/lib/lib.es2015.core.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/typings/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/DOMUtils.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/createBrowserHistory.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/createHashHistory.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/createMemoryHistory.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/LocationUtils.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/PathUtils.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/history/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/jest/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/node/inspector.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/node/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react/global.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react-dom/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react-helmet/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react-router/index.d.ts',
  '/home/linne/Projects/cloud.gov.au/www/ui/node_modules/@types/react-router-dom/index.d.ts' ]
/home/linne/Projects/cloud.gov.au/www/ui/node_modules/fork-ts-checker-webpack-plugin/lib/service.js:22
        throw error;
        ^

FatalError: 
Invalid source file: /home/linne/Projects/cloud.gov.au/www/ui/src/App.tsx. Ensure that the files supplied to lint have a .ts, .tsx, .d.ts, .js or .jsx extension.

Taking a look at your tsconfig.json, this seems to work as intended:
https://github.com/govau/cloud.gov.au/blob/da110639778b5bf6257e3197ef2e4165df4837ba/www/ui/tsconfig.json#L31-L33
You've explicitly listed typings/index.d.ts as the only file included in your project. Everything other file is just added due to a direct or transitive dependency to it. Don't suppose this was your intention, though.

I was able to fix this issue with the following steps:

  • Replace the files config option with:
  "include": [
    "typings/index.d.ts",
    "src/**/*"
  ]
  • Install @types/react-test-renderer, since that package is currently absent.

The reason this issue did not raise before is that this plugin utilizes the ts.Program instance directly, which strictly adheres to the provided tsconfig.json.

@jonathaningram
Copy link
Author

@DorianGrey wow thank you, you're awesome. Do you think there's any way to alleviate this kind of thing in the future for other people or does it just come down to a silly configuration file on my part?

@DorianGrey
Copy link
Collaborator

I fear it's the latter one. The typescript docs explicitly mention that the files entry has to contain every file that is intended to be part of the project. The only reason that things worked before was that this config entry is not taken into account in every part of the build, esp. in the webpack part, which uses a separate include/exclude mechanism.
I.e.: Your config was wrong since you've added the files entry, but it did not cause any problems because no part of the chain took care of it.

@pavanpodila
Copy link

I have tried all of the approaches above and it still keeps failing for every file save!

@brunolemos
Copy link

brunolemos commented Apr 1, 2018

I'm having the same issue, but the cause is different.

My include is correct.
After some investigation, it seems to be because I'm using symlinks and, It every time I save a file, ForkTsCheckerWebpackPlugin tries to check the file twice -- the symlinked one and the normal one. It works for the first it gets, for the second it gives the exception.

Added console.log on Linter.prototype.getSourceFile from node_modules/tslint/lib/linter.js:

[linter][filename] web/src/my-symlink-folder/src/screens/LoginScreen.tsx
[linter][filename] src/screens/LoginScreen.tsx [ERROR]

Workaround: I disabled ForkTsCheckerWebpackPlugin for now so I can edit the files without having to restart the server.

@CodeJjang
Copy link

+1
I also suffer from this and nothing works. Have to reload server on every new file. :/

@stnwk
Copy link

stnwk commented May 15, 2018

Having

  "include": [
    "src/**/*"
  ]

and

    new ForkTsCheckerWebpackPlugin({
      // other options
	  watch: false // <- fix
    }),

did the trick for me!

@joshpcausey
Copy link

I had this same issue. I made a pull request of what fixed the issue for me. TypeStrong/fork-ts-checker-webpack-plugin#127

@copiali
Copy link

copiali commented Aug 10, 2018

@joshpcausey could you please also create a PR to update the fork-ts-checker-webpack-plugin version for react-script-ts?

@mnemanja
Copy link

Hi guys, any update on this?
@copiali, @joshpcausey?

@mnemanja
Copy link

mnemanja commented Nov 27, 2018

@copiali, I have tested it with the pull request version and the problem is gone. Could you please check the failed test, please?

@anasanzari
Copy link

+1

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants