Fork TS Checker Hook Loader
What it does?
Allows Webpack to handle errors from ForkTsChecker and HappyPack while these run in a separate process.
Description
Works together with Fork Ts Checker Webpack Plugin, HappyPack, and ts-loader. While ForkTSChecker works in a separate process, the loader listens for the hook fork-ts-checker-receive
and fork-ts-checker-done
right before the files are emitted, so it's possible to pass control to Webpack to handle errors and warnings.
Installation
Install the following packages:
npm install --save-dev forktschecker-hook-loadernpm install --save-dev fork-ts-checker-webpack-plugin happypack cache-loader
Examples
You can check an example in the example folder
Alternatively, you can:
- Clone the repository
- Run
npm install
- Run
npm run webpack:example
to run webpack in--watch
mode - The output can be seen in the
/example/dist
folder
Configuration
- Create a Webpack Configuration file (webpack.config.js):
const ForkTsCheckerWebpackPlugin = const HappyPack = const webpack = moduleexports = stats entry: './entry.tsx' output: filename: 'entry.bundle.js' resolve: extensions: '.ts' '.tsx' '.js' '.jsx' module: rules: test: /\.tsx?$/ exclude: /node_modules/ use: loader: 'cache-loader' loader: 'happypack/loader?id=ts' loader: 'forktschecker-hook-loader' plugins: // < !Doesn't emit on errors id: 'ts' loaders: loader: 'ts-loader' options: configFile: './tsconfig.json' happyPackMode: true checkSyntacticErrors: true tsconfig: './tsconfig.json' tslint: './tslint.json' /\.d\.ts$/ /.js$/
- Add a tsconfig.json file. For example:
- Run Webpack:
webpack --config webpack.config.js
or in watch mode:
webpack --config webpack.config.js --watch
Loader Options
emitInWatchMode (boolean) (default = false)
Outputs warnings and errors when Webpack is run with --watch
flag. It's useful when ForkTsCheckerWebpackPlugin
option silent
is set to true
.
Example:
loader: 'forktschecker-hook-loader' options: emitInWatchMode: true
useEmitFormatter (boolean|string) (default = false)
If set to true
, uses the formatter specified in ForkTsCheckerWebpackPlugin
option formatter
(which by default is formatter: "default"
).
This loader provides an additional formatter when useEmitFormatter
is a string
and the value is default
.
When this option is set to true
or "default"
, it will format the emitted errors and warnings. This is different from logging which doesn't report errors or warnings to Webpack.
Example:
loader: 'forktschecker-hook-loader' options: useEmitFormatter: true
Another example:
loader: 'forktschecker-hook-loader' options: useEmitFormatter: 'default'
License
MIT License