How to make CRACO watch for specific node modules package?
tal-rofe opened this issue · comments
Tal Rofe commented
I want CRACO to watch specific package changes (as it is a private package in my monorepo environment..).
So I configured craco:
import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
import type { CracoConfig } from '@craco/craco';
const config: CracoConfig = {
eslint: { enable: false },
plugins: [
{
plugin: {
overrideWebpackConfig: ({ webpackConfig }) => {
webpackConfig.resolve!.plugins!.push(
new TsconfigPathsPlugin({
configFile: './tsconfig.base.json',
extensions: ['.ts'],
}),
);
return webpackConfig;
},
},
},
],
devServer: {
watchOptions: {
ignored: /node_modules\/(?!@blabla\/common)/,
},
},
};
export default config;
I guess you should only relate to devServer
key. But when I try to run CRACO I get:
cross-env BROWSER=none craco start
craco: *** Cannot find ESLint plugin (ESLintWebpackPlugin). ***
Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options has an unknown property 'watchOptions'. These properties are valid:
object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }
ELIFECYCLE Command failed with exit code 1.
```
Zane McCaig commented
I use something like this:
class WatchExternalFilesPlugin {
apply(compiler) {
compiler.hooks.afterCompile.tapAsync(
'WatchExternalFilesPlugin',
(compilation, callback) => {
[
path.join(__dirname, 'your-directory-of-interest'),
].forEach(path => compilation.contextDependencies.add(path));
callback();
});
}
}
Along with a webpackConfig.plugins.push(new WatchExternalFilesPlugin());
call in my craco.config.js
Tal Rofe commented
As I changed to other package, this issue is no longer relevant to me.