fork-ts-checker-webpack-plugin: this.compiler.applyPluginsAsync( is not a function
After upgrading to the following setup:
"webpack": "^4.17.2",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.8"
fork-ts-checker-webpack-plugin
fails at line 354 in index.ts
TypeError: _this.compiler.applyPluginsAsync is not a function
It seems that the compiler
object passed to the constructor has a different format.
Also, I previously have disabled fork-ts-checker-notifier-webpack-plugin
because of an unrecognized hook. Namely:
Error: Plugin could not be registered at 'fork-ts-checker-receive'. Hook was not found.
BREAKING CHANGE: There need to exist a hook at 'this.hooks'. To create a compatiblity layer for this hook, hook into 'this._pluginCompat'.
I can create a separate issue in that plugins page if you find that best.
Below adding my webpack.development
const path = require("path");
const webpack = require("webpack");
// const ForkTsCheckerNotifierWebpackPlugin = require("fork-ts-checker-notifier-webpack-plugin");
const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin")
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const shared = require("./shared");
const main = [
"react-hot-loader/patch",
"webpack-dev-server/client?http://localhost:8080",
"webpack/hot/only-dev-server",
"core-js",
"whatwg-fetch",
"./src/index.tsx"
];
const vendor = shared.makeVendorEntry({ mainModules: main, modulesToExclude: ["semantic-ui-css"] })
module.exports = {
context: process.cwd(), // to automatically find tsconfig.json
devtool: "inline-source-map",
entry: {
main: main,
vendor: vendor
},
mode: "development",
output: {
path: path.resolve(__dirname, "dist"),
devtoolLineToLine: true,
filename: "bundle.js",
sourceMapFilename: "bundle.js.map",
publicPath: "/",
chunkFilename: '[name].chunk.js'
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
// new ForkTsCheckerNotifierWebpackPlugin({ title: "TypeScript", excludeWarnings: false }),
new ForkTsCheckerWebpackPlugin({
tslint: true,
checkSyntacticErrors: true,
watch: ["./src"] // optional but improves performance (fewer stat calls)
}),
new webpack.NoEmitOnErrorsPlugin(),
new HtmlWebpackPlugin({
inject: true,
template: "public/index.html",
favicon: 'public/favicon.ico'
}),
new CleanWebpackPlugin(['dist']),
new ExtractTextPlugin({ filename: "[name].[contenthash].css", allChunks: true }),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
}),
],
module: {
rules: [
{
test: /.tsx?$/,
use: [
{ loader: "ts-loader", options: { happyPackMode: true } }
],
exclude: path.resolve(process.cwd(), "node_modules"),
include: path.resolve(process.cwd(), "src"),
},
{
test: /\.(s?)css$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
{
loader: "css-loader",
query: {
modules: true,
localIdentName: "[name]__[local]___[hash:base64:5]",
minimize: true,
},
},
{
loader: "resolve-url-loader" // resolves url for sass-loader
},
{
loader: "sass-loader" // compiles Sass to CSS
},
]
})
},
{
test: /\.(png|jp(e*)g|svg)$/,
use: [{
loader: "url-loader",
options: {
limit: 8000, // Convert images < 8kb to base64 strings
name: "images/[hash]-[name].[ext]"
}
}]
}
]
},
resolve: {
extensions: [".tsx", ".ts", ".js"],
plugins: [
new TsconfigPathsPlugin({ configFile: "./tsconfig.json" })
]
},
devServer: {
hot: true,
historyApiFallback: true,
stats: "errors-only"
}
};
UPDATE After upgrading both:
"fork-ts-checker-notifier-webpack-plugin": "^0.4.0",
"fork-ts-checker-webpack-plugin": "^0.4.9",
I get
compiler.hooks.forkTsCheckerReceive.tap(
'fork-ts-checker-notifier-webpack-plugin',
this.compilationDone.bind(this)
);
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 21 (9 by maintainers)
PR accepted. Closing issue
Also, now I noticed the comment about the order, however, I’d still prefer it to be more explicit. People (like me) tend to overlook stuff that isn’t highlighted 🙂
Sure. I’ll do it tomorrow, if that’s ok with you