Registry / devops / fork-ts-checker-async-overlay-webpack-plugin

fork-ts-checker-async-overlay-webpack-plugin

JSON →
library0.4.0jsnpmunverified

A webpack plugin that connects fork-ts-checker-webpack-plugin (with async: true) to the error overlay of webpack-dev-server. Version 0.4.0 is the latest stable release. The plugin addresses the limitation that type checking errors from fork-ts-checker-webpack-plugin are not shown in the dev server overlay when running asynchronously (async: true). It works by re-firing the webpack-dev-server's done hook after type checking completes, but only if there are errors, to avoid unnecessary page reloads. It requires fork-ts-checker-webpack-plugin ^4.1.6 as a peer dependency and is intended for use with ts-loader's transpileOnly option. Key differentiator: allows fast incremental builds (async: true) while still showing type errors in overlay, avoiding the need to set async: false which slows down builds.

devopsweb-framework
npm install fork-ts-checker-async-overlay-webpack-plugin
github ↗package ↗
INSTALL
IMPORT
SIG · FORK-TS-CHECKER-AS
F
fork-ts-checker-async-overlay-webpack-plugin
devopsjavascriptv0.4.0
Install
—
Import
—
Disk
—
Pass rate
0/ 6
Env Coverage0 / 6
glibc
18–22
musl
18–22
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18–226 runs
build_error
glibc
node 18–226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

default
✓ const ForkTsCheckerAsyncOverlayWebpackPlugin = require('fork-ts-checker-async-overlay-webpack-plugin')
✗ import ForkTsCheckerAsyncOverlayWebpackPlugin from 'fork-ts-checker-async-overlay-webpack-plugin'
CJS only; no default ES module export available.
ForkTsCheckerAsyncOverlayWebpackPlugin
✓ const ForkTsCheckerAsyncOverlayWebpackPlugin = require('fork-ts-checker-async-overlay-webpack-plugin')
Use the require form. The package does not export named symbols.

Configures webpack with ts-loader (transpileOnly), fork-ts-checker-webpack-plugin, and this plugin to show type errors in dev server overlay.

const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const ForkTsCheckerAsyncOverlayWebpackPlugin = require('fork-ts-checker-async-overlay-webpack-plugin'); module.exports = { module: { rules: [ { test: /\.tsx?$/, use: { loader: 'ts-loader', options: { transpileOnly: true } }, exclude: /node_modules/ } ] }, plugins: [].concat( new ForkTsCheckerAsyncOverlayWebpackPlugin({ checkerPlugin: new ForkTsCheckerWebpackPlugin() }).plugins() ), devServer: { overlay: true, inline: true } };
Debug
Known issues
gotchaOnly errors (not warnings) are shown in overlay.
fix
Use fork-ts-checker-webpack-plugin's built-in warning reporting or no overlay for warnings.
affects: >=0.0.0
gotchaThe plugin requires devServer.overlay to be true and devServer.inline to be true.
fix
Set devServer: { overlay: true, inline: true } in webpack config.
affects: >=0.0.0
gotchaThe plugin only re-fires the done hook if there are errors; otherwise the overlay is not updated.
fix
Expected behavior; no workaround.
affects: >=0.0.0
breakingMajor version 0.x: API may change without notice. Peer dependency on fork-ts-checker-webpack-plugin ^4.1.6 may not be compatible with newer versions.
fix
Pin fork-ts-checker-webpack-plugin to ^4.1.6 and monitor for updates.
affects: >=0.0.0 <1.0.0
Errors
Common errors & fixes
Type errors not showing in overlay even though fork-ts-checker-webpack-plugin reports them
Missing devServer.overlay: true or devServer.inline: true, or missing .plugins() call.
fix
Ensure devServer config has overlay: true and inline: true, and call .plugins() on the plugin instance.
Cannot find module 'fork-ts-checker-async-overlay-webpack-plugin'
Package not installed or not in node_modules.
fix
Run 'npm install fork-ts-checker-async-overlay-webpack-plugin --save-dev'.
TypeError: ForkTsCheckerAsyncOverlayWebpackPlugin is not a constructor
Using ES module import syntax instead of require.
fix
Use require() instead of import: const ForkTsCheckerAsyncOverlayWebpackPlugin = require('fork-ts-checker-async-overlay-webpack-plugin');
Upgrade
Version history
0.4.0latest on npm
Audit
Dependencies
fork-ts-checker-webpack-pluginrequiredPeer dependency; this plugin integrates with it to show type checking errors in the dev server overlay.
Agent activity
2 hits · last 30 days
node
2
Resources
githubhttps://github.com/ypresto/fork-ts-checker-async-overlay-webpack-plugin ↗
packagehttps://www.npmjs.com/package/fork-ts-checker-async-overlay-webpack-plugin ↗
fork-ts-checker-async-overlay-webpack-plugin — npm install fork-ts-checker-async-overlay-webpack-plugin · libregistry