New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[dynamic-import-chunkname] Disallow chunk name when eager mode is enabled #3004
base: main
Are you sure you want to change the base?
Conversation
When would you not want this option enabled? |
Never, really. I'll just make it the default. |
…Mode: 'eager' is set; add suggestions to remove name in eager mode'
db3c637
to
2b626fb
Compare
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #3004 +/- ##
==========================================
+ Coverage 95.66% 95.82% +0.15%
==========================================
Files 78 78
Lines 3275 3279 +4
Branches 1150 1151 +1
==========================================
+ Hits 3133 3142 +9
+ Misses 142 137 -5 ☔ View full report in Codecov by Sentry. |
Is there anyone who this could break? I assume not, because the only complaint would be that it fails to warn on something? |
Exactly, this only suppresses existing warnings in a narrow case, and doesn't introduce new warnings. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks, this is great!
One more enhancement we may want to consider before landing this: when webpackMode is eager, and a useless name is present, could we give a suggestion to remove the name?
@ljharb Yeah that makes sense to me, just updated the PR to warn when chunk name and eager mode are both set. |
cb74902
to
340c8f2
Compare
if (isChunknamePresent && isEagerModePresent) { | ||
context.report({ | ||
node, | ||
message: | ||
`dynamic imports should not have both webpackChunkName and webpackMode: "eager"`, | ||
}); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if (isChunknamePresent && isEagerModePresent) { | |
context.report({ | |
node, | |
message: | |
`dynamic imports should not have both webpackChunkName and webpackMode: "eager"`, | |
}); | |
} | |
if (isChunknamePresent && isEagerModePresent) { | |
context.report({ | |
node, | |
message: 'dynamic imports should not have both webpackChunkName and webpackMode: "eager"`\', | |
}); | |
} |
also is there any reason why someone might still want a chunk name? if so, then this should be a suggestion instead of a warning
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think having a chunk name with eager mode makes sense, since eager mode explicitly disables creating a new chunk, so the module is just lazily evaluated instead of lazily loaded+evaluated. Adding a chunk name anyways basically reverts back to being webpackMode: 'lazy'
and generates a new chunk. A warning would help users catch unintentional additional chunks when using webpackMode: 'eager'
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ok, so having both is always a mistake. thanks!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
altho actually - that means that removing the name would quietly change the mode from lazy to eager - i think this should be a suggestion to either remove the name, or remove/change the webpackMode, to be safe.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
makes sense, i'll make that change!
@amsardesai sorry if i wasn't clear; a "suggestion" isn't prose giving the user a hint, it's an actual eslint feature where the editor will prompt them with multiple autofixes they have to explicitly choose. For an example, look for a rule with |
Ah, I didn't realize you meant ESLint suggestions. Let me do that. |
Hey @ljharb, would love to know if this can be merged now, or if any other changes need to be made! |
7173569
to
a655f36
Compare
@amsardesai ok, i've rebased this and it's probably ready to go :-) (assuming tests pass) just wondering about some of the remaining test changes (not the additions, those make sense) - some are lazy → eager, and some are eager → lazy. Can you go through and comment in the PR on those lines, and explain what motivated the change? i suspect you have a convincing explanation for them all but this way it'll be documented for me in the future :-) |
a655f36
to
898ce3b
Compare
The dynamic-import-chunkname rule is useful for catching missing chunk names for imports, however much of our imports use
webpackMode: "eager"
to disable creating a separate chunk (i.e for lazy evaluation). AddingwebpackChunkName
anyway can force webpack to generate a chunk, defeating the purpose of the eager mode. This PR changes the rule to disallow chunk names whenwebpackMode: "eager"
is set.Related issue: #1904