Knip can not find webpack-plugins while recursively linting webpack configurations about knip HOT 20 CLOSED

Knip should handle this properly. Note that Knip swallows some errors when not using --debug or --no-progress. This might be unexpected. It's hard to draw a line which errors should be suppressed or not, there's definitely room for improvement here.

Could you please try with --debug and see what errors you get?

from knip.

Ok, going through the debug messages I found that yes, it does recursively look, but it can't find everything I have. From my webpack-dependencies it can only find most of the loaders, but none of the plugins.

[knip] Included entry files (10)
[
 ...
  '<root>/webpack.config.js' // it finds the entry config
]
[knip] Included files resolved from entry files (57)
[
   ...
  '<root>/webpack.common.js',
  '<root>/webpack.config.js',
  '<root>/webpack.dev.js',
  '<root>/webpack.prod.js'  // it finds the modes
]

So yes, it handles it, but it can't find everything.

from knip.

From these webpack dependencies used in this path:

babel-loader
ts-loader
esbuild-loader
esbuild
MiniCssExtractPlugin.loader
css-loader
less-loader
base64-inline-loader
Dotenv
ForkTsCheckerWebpackPlugin
MiniCssExtractPlugin
CaseSensitivePathsWebpackPlugin
CleanWebpackPlugin
ExtraWatchWebpackPlugin
CssMinimizerPlugin
JsonMinimizerPlugin
HtmlMinimizerPlugin
EslintPlugin
PowerBICustomVisualsWebpackPlugin
CircularDependencyPlugin

it can only find

[knip] Dependencies used by Webpack configuration (8)
[
  '<root>\\node_modules\\mini-css-extract-plugin\\dist\\loader.js',
  'babel-loader',
  'base64-inline-loader',
  'css-loader',
  'less-loader',
  'ts-loader',
  'webpack-cli',
  'webpack-dev-server'
]

from knip.

Any chance you could share the configuration file(s) here? This would tremendously to improve Knip :)

from knip.

Here is my full configuration. Hopefully I have set up the visibility correctly.
https://pastebin.com/Ym7vMkJm
There are 4 files, I put the full file name above each. Just mock some files if you get errors.

from knip.

The dependencies listed with "Dependencies used by Webpack configuration (8)" are found by the custom resolver for strings like loader: 'ts-loader' which are very specific and custom to Webpack. This happens in the Knip webpack plugin.

The rest of the dependencies (imported like require('mini-css-extract-plugin')) are generic JS/TS and should be caught using "regular" dependency resolving. This happens later in the process.

So it's like a two-pass process. The debug message should be more clear about this, though.

Are there false positives (unused or unlisted dependencies) related to Webpack in the end report?

from knip.

This is actually the last dependency resolver process in the debug message.
List of found unused dev dependencies:

Unused dev dependencies (29)
@babel/runtime                        package.json
@babel/runtime-corejs3                package.json
@commitlint/cli                       package.json
@commitlint/config-conventional       package.json
@microsoft/tsdoc                      package.json
@microsoft/tsdoc-config               package.json
@typescript-eslint/typescript-estree  package.json
case-sensitive-paths-webpack-plugin   package.json
circular-dependency-plugin            package.json
clean-webpack-plugin                  package.json
css-minimizer-webpack-plugin          package.json
dotenv                                package.json
dotenv-webpack                        package.json
editorconfig                          package.json
esbuild                               package.json
esbuild-loader                        package.json
eslint-config-standard                package.json
eslint-import-resolver-webpack        package.json
eslint-plugin-babel                   package.json
eslint-webpack-plugin                 package.json
extra-watch-webpack-plugin            package.json
fork-ts-checker-webpack-plugin        package.json
html-minimizer-webpack-plugin         package.json
json-minimizer-webpack-plugin         package.json
mini-css-extract-plugin               package.json
powerbi-visuals-webpack-plugin        package.json
terser-webpack-plugin                 package.json
webpack-bundle-analyzer               package.json
webpack-merge                         package.json

from knip.

v1.10.0 should improve things. Although I wonder why it does not seem to resolve regular require() in your project. In my testing (and as part of the tests) this works fine. Any chance you could try again with v1.10.0 and see the report output?

from knip.

By the way, there was a typo env.prodution in the shared files, this affects results as it would find only development config in both passes.

from knip.

Thanks for pointing it out. :)

Yes, now finds all webpack plugins. Thank you!

from knip.

Thanks for your help and confirmation @ElPrudi, this is exactly the idea of Knip development: getting less and less false positives (by improving the plugins).

from knip.

Ok, I have to reopen it, because I wrongly assumed it has been fixed due to my wrong knip.json config.
knip.json

{
	"$schema": "https://unpkg.com/knip@1/schema.json",
	"webpack": {
		"config": ["webpack.config*.js"]
	},
	"workspaces": {
		".": {
			"entry": "src/visual.ts",
			"project": "src/**/*.ts"
		},
		"packages/*": {
			"entry": "index.{js,ts}",
			"project": "**/*.ts"
		}
	}
}

For some reason I can't find the regular dependency resolution process in the debug message. Maybe there is a difference for knip because the main project is running in the frontend browser view while webpack is running in the backend view, therefore it can't get the require()?
Anyways, here is my debug output up until the unused dependencies:
https://pastebin.com/h4mPWnt5

from knip.

The dependencies of regular source code is not listed separately in debug output.

Afraid I can't help if I don't have access to something I can run and debug.

Not sure if it's helpful at all, but this webpack fixture directory is part of the test suite and seems to work fine: https://github.com/webpro/knip/tree/main/test/fixtures/plugins/webpack

from knip.

What if you try using an typescript entry file that uses the module export import syntax?

Because that's the only difference between my case and your test. My theory is that knip checks the module type for the entry file and uses it throughout the whole project, including the webpack files, and therefore doesn't read the require statements, because those two syntaxes are for different module types.

This could also be the reason why you were initially confused that knip did not read the require statements in my project.

from knip.

Yeah that makes sense, but Knip (partnering up with ts-morph tbh) are pretty flexible in this regard. Just tried a few things and that seems not to be the case, but can't be sure without the actual thing.

from knip.

Perhaps making the --debug options more detailed, or issuing warnings and errors, and making the search more rigorous would benefit the search to force a better work environment in which its used just like eslint does with its warnings and errors.

from knip.

Is there still an issue here? Perhaps things are working better in v2?

from knip.

Unfortunately, no. I think Knip has problems with the monorepo structure as a whole. Knip only fetches the packages from the root package.json, ignoring the dependencies of the subpackages package.jsons. Since I plan to deploy each subpackage to npm, I guess I need to restructure my package locations for knip or not run knip as a monorepo.

I can now say that it is not a problem with the webpack parser, but rather with the monorepo parser.

from knip.

Ok, after testing around in another project, the problem still exists. I don't know if my configuration is just bad or something else, but I don't actually care about webpack anymore since I'm currently switching to esbuild, so let's pretend this problem doesn't exist.

I'll leave this issue open if anyone else has a problem with the webpack parser.

from knip.

Unfortunately, no. I think Knip has problems with the monorepo structure as a whole. Knip only fetches the packages from the root package.json, ignoring the dependencies of the subpackages package.jsons. Since I plan to deploy each subpackage to npm, I guess I need to restructure my package locations for knip or not run knip as a monorepo.

Knip v2 uses package.json#workspaces and analyzes all of them by default, plus extra directories with package.json if added to workspaces in knip.json. This is now also at https://github.com/webpro/knip#workspaces-monorepos.

I can now say that it is not a problem with the webpack parser, but rather with the monorepo parser.

Without a reproducible case it's hard to decipher potential issues. The original issue seems not relevant anymore, so I'm going to close this issue. If you (or anyone) else has issue, feel free to open a new issue.

from knip.