Open sgarfinkel opened 1 year ago
I think you can use regular webpack hooks to do that. In the example, you don't use data emitted by the plugin, so you can simply tap into webpack's hooks :)
Ah, you want to wait for the new version of files to be emitted, right? In that case, you will have to set async: false
in plugin options. This way webpack will wait for the plugin to finish type checking. The issues
hook is called on afterCompile
in async: false
mode
Cool, thanks! I'll close the issue then.
Hi @piotr-oles sorry for necroing this. I'm trying this path again and am still having deprecation warnings. It looks like afterCompile
is too late. In Webpack 4 you can modify the emitted assets at this hook, but in Webpack 5+ it is now an error to do so (I assume in Webpack 6 it will be blocked entirely). There is now an earlier hook, compilation.hooks.processAssets
that is meant for modifying the set of emitted assets. Ideally it would be great if async: false
tapped this hook.
I have faced a similar issue.
ts-loader
replaced with esbuild-loader
to speedup buildd.ts
generation delegated from ts-loader
to ForkTsCheckerWebpackPlugin
For now, I have come up with the following workaround:
types
to be emitted into a separate folder (so, it's easier to control them)CleanWebpackPlugin
to clean build assetstypes
types
only once at the init
phase using a custom pluginconst { CleanWebpackPlugin } = require('clean-webpack-plugin');
const { rmSync, existsSync } = require('fs');
// Custom plugin that cleanup only definition files
class DefinitionsCleanupPlugin {
apply(compiler) {
const outputPath = compiler.options.output.path;
if (!outputPath) {
throw new Error('[DefinitionsCleanupPlugin]: No output path provided');
}
compiler.hooks.initialize.tap('DefinitionsCleanupPlugin', () => {
const typesPath = `${outputPath}/types`;
if (existsSync(typesPath)) {
rmSync(typesPath, { force: true, recursive: true });
}
});
}
}
...
plugins: [
new ForkTsCheckerWebpackPlugin({
typescript: {
mode: 'write-dts',
},
}),
new DefinitionsCleanupPlugin(),
new CleanWebpackPlugin({
// Skip cleanup of types
cleanOnceBeforeBuildPatterns: ['**/*', '!types/**/*', '!types'],
}),
]
Cons:
watch
mode, definitions are not cleaned during rebuilds (probably can be tuned by tapping other hooks in custom plugin, but it's ok for my scenario)beforeEmit
hook in the ForkTsCheckerWebpackPlugin
itself and tap into it to perform a cleanup
Feature motivation
Currently, if the checker emits files to the webpack outputPath, setting
{ output: { clean: true } }
will remove them. The reason is because Webpack does not know that emitted files, such as declarations and declaration maps, should be treated as assets generated by the bundle.At a minimum, it would be nice if the set of emitted files was available in a tapable hook that runs before the compilation finishes. It looks like you can sort of get this by tapping the
issues
hook and then globbing the output folder, but it seems like this hook fires too late. In Webpack 5, you'll getFeature description
It would be nice if the plugin just did this out of the box, but at a minimum, it would be nice to add a new hook that runs during the emit/processAsset phase and passes in the list of emitted files to the tap.
Feature implementation
Here's an example that uses the existing hooks, as well as
fast-glob
to grab the set of generated files and add them as assets. The problem is that it runs too late and throws deprecation warnings in Webpack 5.