Fork-ts-checker-webpack-plugin: Feature Request: Include Definition File in Package Distribution

Created on 19 Oct 2017  Â·  8Comments  Â·  Source: TypeStrong/fork-ts-checker-webpack-plugin

I have a webpack config written in Typescript (webpack.config.ts; it allows me to use an interface to ensure I'm not misconfiguring webpack). When I try to import fork-ts-checker-webpack-plugin, however, I'm shown an error about missing Typescript definitions.

/Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:307
        throw new TSError(formatDiagnostics(diagnosticList, cwd, ts, lineOffset))
              ^
TSError: ⨯ Unable to compile TypeScript
webpack.config.ts (2,45): Could not find a declaration file for module 'fork-ts-checker-webpack-plugin'. '/Users/andrew/Development/ProjectName/node_modules/fork-ts-checker-webpack-plugin/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/fork-ts-checker-webpack-plugin` if it exists or add a new declaration (.d.ts) file containing `declare module 'fork-ts-checker-webpack-plugin';` (7016)
    at getOutput (/Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:307:15)
    at /Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:336:16
    at Object.compile (/Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:498:11)
    at Module.m._compile (/Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:392:43)
    at Module._extensions..js (module.js:635:10)
    at Object.require.extensions.(anonymous function) [as .ts] (/Users/andrew/Development/ProjectName/node_modules/ts-node/src/index.ts:395:12)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)
    at Module.require (module.js:568:17)

Given that the package is actually written in Typescript, it would be great if you included the type definitions with distributions.

Note that some work appears to be required. I had no problem downloading the package, installing dependencies with yarn and building the package with yarn build. However, when I add "declaration": true, to "compilerOptions" in src/tsconfig.json, yarn build fails unexpectedly:

$ yarn build
yarn run v1.2.0
$ tsc --version && tsc --project "./src"
Version 2.5.2
src/CancellationToken.ts(22,31): error TS4070: Parameter 'json' of public static method from exported class has or is using private name 'CancellationTokenData'.
src/FilesRegister.ts(10,55): error TS4031: Public property 'files' of exported class has or is using private name 'DataShape'.
src/FilesRegister.ts(11,33): error TS4031: Public property 'dataFactory' of exported class has or is using private name 'DataShape'.
src/FilesRegister.ts(13,45): error TS4063: Parameter 'dataFactory' of constructor from exported class has or is using private name 'DataShape'.
src/FilesRegister.ts(39,3): error TS4055: Return type of public method from exported class has or is using private name 'DataShape'.
src/FilesRegister.ts(53,3): error TS4055: Return type of public method from exported class has or is using private name 'DataShape'.
src/FilesRegister.ts(57,48): error TS4073: Parameter 'mutator' of public method from exported class has or is using private name 'DataShape'.
src/IncrementalChecker.ts(61,10): error TS4050: Return type of public static method from exported class has or is using name 'IConfigurationFile' from external module "/Users/andrew/.virtualenvs/tmp-d22ef013cf858b8/fork-ts-checker-webpack-plugin/node_modules/tslint/lib/configuration" but cannot be named.
src/IncrementalChecker.ts(107,10): error TS4050: Return type of public static method from exported class has or is using name 'Linter' from external module "/Users/andrew/.virtualenvs/tmp-d22ef013cf858b8/fork-ts-checker-webpack-plugin/node_modules/tslint/lib/linter" but cannot be named.
src/NormalizedMessage.ts(19,27): error TS4028: Public static property 'TYPE_DIAGNOSTIC' of exported class has or is using private name 'ErrorType'.
src/NormalizedMessage.ts(20,21): error TS4028: Public static property 'TYPE_LINT' of exported class has or is using private name 'ErrorType'.
src/NormalizedMessage.ts(23,26): error TS4028: Public static property 'SEVERITY_ERROR' of exported class has or is using private name 'Severity'.
src/NormalizedMessage.ts(24,28): error TS4028: Public static property 'SEVERITY_WARNING' of exported class has or is using private name 'Severity'.
src/NormalizedMessage.ts(26,9): error TS4031: Public property 'type' of exported class has or is using private name 'ErrorType'.
src/NormalizedMessage.ts(28,13): error TS4031: Public property 'severity' of exported class has or is using private name 'Severity'.
src/NormalizedMessage.ts(34,21): error TS4063: Parameter 'data' of constructor from exported class has or is using private name 'NormalizedMessageJson'.
src/NormalizedMessage.ts(74,31): error TS4070: Parameter 'json' of public static method from exported class has or is using private name 'NormalizedMessageJson'.
src/NormalizedMessage.ts(111,30): error TS4070: Parameter 'typeA' of public static method from exported class has or is using private name 'ErrorType'.
src/NormalizedMessage.ts(111,48): error TS4070: Parameter 'typeB' of public static method from exported class has or is using private name 'ErrorType'.
src/NormalizedMessage.ts(122,39): error TS4070: Parameter 'severityA' of public static method from exported class has or is using private name 'Severity'.
src/NormalizedMessage.ts(122,60): error TS4070: Parameter 'severityB' of public static method from exported class has or is using private name 'Severity'.
src/NormalizedMessage.ts(151,3): error TS4055: Return type of public method from exported class has or is using private name 'NormalizedMessageJson'.
src/index.ts(49,12): error TS4031: Public property 'options' of exported class has or is using private name 'Options'.
src/index.ts(63,14): error TS4031: Public property 'formatter' of exported class has or is using private name 'Formatter'.
src/index.ts(87,24): error TS4063: Parameter 'options' of constructor from exported class has or is using private name 'Options'.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Please note that these errors are show when running TSLint.

$ tslint --project src --type-check
enhancement

Most helpful comment

For anyone is interested to using it with webpack.config.ts, I've just published @types/fork-ts-checker-webpack-plugin in https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25494 which should support basic usage.

Of course it would be great if we support .d.ts declarations inside.

All 8 comments

I've created experimental branch feature/declaration-files - please check if this solves your issue :)

Cloning and switching to that branch yields the following on npm i:

tsc --version && tsc --project "./src"

Version 2.6.1
src/IncrementalChecker.ts(147,33): error TS2345: Argument of type 'ReadonlyArray' is not assignable to parameter of type 'SourceFile[]'.
Property 'fill' is missing in type 'ReadonlyArray'.
src/IncrementalChecker.ts(150,21): error TS7006: Parameter 'sourceFile' implicitly has an 'any' type.
src/IncrementalChecker.ts(155,13): error TS2322: Type 'ReadonlyArray' is not assignable to type 'Diagnostic[]'.
Property 'fill' is missing in type 'ReadonlyArray'.
src/index.ts(32,11): error TS6133: 'options' is declared but its value is never read.

I'm also not sure that simply exporting the interface names would actually solve anything - wouldn't you need a types attribute in package.json in the absence of index.d.ts? Per https://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html

Would appreciate seeing this released. Like the OP, I'm using this directly in a TS project and currently manually copying over the types to a local .d.ts file.

@leebenson - if you're using TypeScript 2.5 do you see the same error? I've seen a few unexpected breakages with 2.6 and I wonder if this is another example?

Hi @piotr-oles , thanks for looking into this. Unfortunately, the new branch continues to have the same problem.

I've created an example repository to demonstrate the problem: https://github.com/jambonrose/ts-webpack-fork-type-check-mve . Please note the two branches on the project: project-with-current-version and project-with-dev-version. The first installs the latest fork-ts-checker-webpack-plugin from NPM, while the second _attempts_ to install from Github.

To clarify: the project cannot currently be installed directly from Github. I attempted to do so with the command below.

npm install git+https://[email protected]/Realytics/fork-ts-checker-webpack-plugin#feature/declaration-files

However, this yields a directory without a lib/index.js, causing "Module not found" errors.

Instead I cloned the repository and tried to build the project.

git clone [email protected]:Realytics/fork-ts-checker-webpack-plugin.git
cd fork-ts-checker-webpack-plugin
git co feature/declaration-files
npm i && npm run build

I see the same errors as @leebenson, printed below.

$ npm i && npm run build
> [email protected] install /Users/andrew/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin/node_modules/fsevents
> node install

[fsevents] Success: "/Users/andrew/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile

> [email protected] postinstall /Users/andrew/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js

npm WARN prepublish-on-install As of npm@5, `prepublish` scripts are deprecated.
npm WARN prepublish-on-install Use `prepare` for build steps and `prepublishOnly` for upload-only.
npm WARN prepublish-on-install See the deprecation note in `npm help scripts` for more information.

> [email protected] prepublish /Users/andrew/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin
> npm run build


> [email protected] build /Users/andrew/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin
> tsc --version && tsc --project "./src"

Version 2.6.1
src/IncrementalChecker.ts(147,33): error TS2345: Argument of type 'ReadonlyArray<SourceFile>' is not assignable to parameter of type 'SourceFile[]'.
  Property 'fill' is missing in type 'ReadonlyArray<SourceFile>'.
src/IncrementalChecker.ts(150,21): error TS7006: Parameter 'sourceFile' implicitly has an 'any' type.
src/IncrementalChecker.ts(155,13): error TS2322: Type 'ReadonlyArray<Diagnostic>' is not assignable to type 'Diagnostic[]'.
  Property 'fill' is missing in type 'ReadonlyArray<Diagnostic>'.
src/index.ts(32,11): error TS6133: 'options' is declared but its value is never read.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] build: `tsc --version && tsc --project "./src"`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/andrew/.npm/_logs/2017-11-15T21_08_27_836Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] prepublish: `npm run build`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the [email protected] prepublish script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/andrew/.npm/_logs/2017-11-15T21_08_27_925Z-debug.log

However, installing TypeScript 2.5 does circumvent the problem. I cannot speak to whether these are new checks in 2.6 or else errors.

$ npm install typescript@~2.5
+ [email protected]
updated 1 package in 3.302s

$ npm run build

> [email protected] build /Users/magus/.virtualenvs/tmp-24afe15f56c751/fork-ts-checker-webpack-plugin
> tsc --version && tsc --project "./src"

Version 2.5.3

I manually moved the lib directory into the node_modules/fork-ts-checker-webpack-plugin/ directory from the project-with-dev-version branch of the example repo linked to above. Building the project yields the output below.

$ npm run build

> [email protected] build /Users/andrew/Development/webpack-typescript-starter-mve
> webpack


/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:307
        throw new TSError(formatDiagnostics(diagnosticList, cwd, ts, lineOffset))
              ^
TSError: ⨯ Unable to compile TypeScript
webpack.config.ts (2,45): Could not find a declaration file for module 'fork-ts-checker-webpack-plugin'. '/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/fork-ts-checker-webpack-plugin/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/fork-ts-checker-webpack-plugin` if it exists or add a new declaration (.d.ts) file containing `declare module 'fork-ts-checker-webpack-plugin';` (7016)
    at getOutput (/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:307:15)
    at /Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:336:16
    at Object.compile (/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:498:11)
    at Module.m._compile (/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:392:43)
    at Module._extensions..js (module.js:646:10)
    at Object.require.extensions.(anonymous function) [as .ts] (/Users/andrew/Development/webpack-typescript-starter-mve/node_modules/ts-node/src/index.ts:395:12)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `webpack`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/andrew/.npm/_logs/2017-11-15T21_37_26_809Z-debug.log

I believe @leebenson is right, and that the project must have a index.d.ts that is referenced by package.json.

It would be great if the project were also installable from github, as that would make contributing easier.

There's just a couple of things needed to fix this on the feature/declaration-files branch, both in package.json

1. Peg the Typescript to a working version

This is a temporary solution; obviously, it's better to figure out what broke between TS 2.5.3 and 2.6 that is causing the type errors and fix, but for now, just peg the TS version in package.json:

"typescript": "2.5.3"

After that, npm run build works.

2. Add types

Alongside the entry for main, put a types in package.json:

"main": "lib/index.js",
"types": "lib/index.d.ts",

(I see that you added declaration: true to tsconfig.json already, so index.d.ts is being generated)

After that, we should be able to call the lib like this and get type info automatically:

import ForkPlugin = require("fork-ts-checker-webpack-plugin");

screen shot 2017-11-15 at 22 41 54

For anyone is interested to using it with webpack.config.ts, I've just published @types/fork-ts-checker-webpack-plugin in https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25494 which should support basic usage.

Of course it would be great if we support .d.ts declarations inside.

Looks like this was done as part of #182 and is now available in v1.0.0.

Regarding the all-too-common "has or is using private name" error, I've opened a request to fix issues like these in TypeScript by bringing declaration files to parity with language features. https://github.com/microsoft/TypeScript/issues/35822

Was this page helpful?
0 / 5 - 0 ratings

Related issues

IgnusG picture IgnusG  Â·  3Comments

JasonIsGithubbin picture JasonIsGithubbin  Â·  4Comments

geirsagberg picture geirsagberg  Â·  5Comments

ark120202 picture ark120202  Â·  4Comments

ianschmitz picture ianschmitz  Â·  4Comments