Comments (9)
We are also facing the same issue.
The problem with React.lazy is that it doesn't allow you make lazy components that are exported with "named exports". We use ONLY named exports in our codebase, because default exports are generally bad.
So we created an util lazyImport
that let use use lazy with named exports.
Of course Knip cannot see these and thus reports come components as unused, even though they are used with this special lazy import. I'm not sure how Knip could help us here, just wanted to report that this is a pain point for us too.
from knip.
It's not enabled by default, because what's required for this makes Knip pretty slow especially in larger projects. Not sure how to "auto opt-in", but better docs/discoverability would help for sure. Or some kind of "aggregate flag" to group related flags for easier opt-in. Thanks for the input.
from knip.
The rule of thumb: if "Find All References" for the Foo
export only returns itself in your IDE, Knip won't be able to find other refs either.
Knip covers more when using the --include-libs
flag: https://knip.dev/guides/handling-issues#external-libraries
Not sure it's because this is a demo, but Component
is typed any
here?
Could you be more specific in how Knip could help here? E.g how to ignore such seemingly non-deterministic cases?
from knip.
@AndreaPontrandolfo Does "Find all references" on the exported component find usages?
Knip finds this the examples of https://knip.dev/guides/handling-issues#external-libraries
But not the pattern from the OP:
const Component = lazyImport(() => import('./Foo'), 'Foo');
Would be good to find the "boundaries" here and document it better. And, indeed, ways to more easily ignore stuff and while still getting valuable reporting from Knip.
from knip.
Does "Find all references" on the exported component find usages?
Actually yes.
I used "find all references" on my SimilarProductsSlider
component, and it found the 2 usages where we import it like this:
const { SimilarProductsSlider } = lazyImport(
() => import('@components/SimilarProductsSlider/SimilarProductsSlider'),
'SimilarProductsSlider',
)
from knip.
Interesting. Assuming you've tried --include-libs
, this might be a bug or solvable in Knip. If you could create minimal repro I might be able to fix it.
from knip.
@webpro oh sorry i wasn't clear, that was WITHOUT --include-libs
. Using --include-libs
it actually works (it doesn't report those components as unused).
Maybe the documentation around --include-libs
should be expanded with this edgecase, or maybe it could beneficial to most people if it was enabled by default (and thus, opt-out).
from knip.
Not sure it's because this is a demo, but Component is typed any here?
that would be b/c of the demo i think, it's correctly typed in normal repos
Could you be more specific in how Knip could help here? E.g how to ignore such seemingly non-deterministic cases?
I'd like to tell Knip that these are usages, ideally with my own plugin. FWIW these cases aren't non-deterministic, they are strictly and correctly typed, but defeat the tool
from knip.
I'd like to tell Knip that these are usages, ideally with my own plugin. FWIW these cases aren't non-deterministic, they are strictly and correctly typed, but defeat the tool
there isn't a way to determine these via a glob
Sorry, still not sure how to deal with this. At this point I also don't really see how plugins could help here if they can't be determined through glob pattern(s).
The repro should be minimal yet complete/functional (at least from a TS/compiler perspective). In general, the --include-libs
flag should behave as expected if TypeScript "Find all references" finds refs (other than itself).
from knip.
Related Issues (20)
- Programatically Run HOT 1
- Re-exports with usage of barrel files isn't indexed correctly HOT 6
- Support for external plugins HOT 1
- Commitlint plugin: specifier.startsWith is not a function HOT 1
- commitlint plugin update breaks when `parserPreset` isn't a `string`
- SvelteKit Demo App $app/* unresolved HOT 2
- 5.14.0 breaks knip in git submodules
- Documentation Site Version Selector leads to 404 HOT 2
- Support local custom plugin HOT 2
- Support import.meta.resolve (in Pino v7+ transports) HOT 3
- Unused functions are not being detected HOT 5
- Default import name being used to determine if export is used HOT 7
- Re-exported enum members incorrectly reported as unused HOT 7
- False positive when using a dynamic default importing HOT 2
- Module '"knip"' has no exported member 'KnipConfig'. Did you mean to use 'import KnipConfig from "knip"' instead? HOT 2
- "ignore" file working even though it shouldn't based on the docs HOT 4
- [Svelte@5] Knip fails to resolve `*.svelte.(j|t)s` files HOT 4
- Run the script only against the staged files. HOT 2
- `ignore` is not applied for Auto-fix HOT 1
- Not working with @emotion/styled during string interpolation HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from knip.