Skip to content
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

[Fix] dynamic-import-chunkname: allow single quotes to match Webpack support #1848

Merged

Conversation

straub
Copy link
Contributor

@straub straub commented Jul 7, 2020

Single quotes are supported by Webpack at least in v4.43.0, which is the
version I'm currently using. Since my eslint style prefers single
quotes, I naturally wrote my Webpack magic comments to match, which
worked w/o issue until I tried to enable this rule.

Implemented as a non-breaking relaxation of the existing rule to avoid
complexity per
#1130 (comment)
but please let me know if you prefer a different approach!

Fixes #1130.

Copy link
Member

@ljharb ljharb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm concerned about webpack users prior to v4.43.0 getting false positives here.

I think the safest approach is an option, that defaults to false, but can be set to "detect" or true. When "detect", it could try/catch-require webpack and check the version number.

Comment on lines +33 to +34
const commentStyleRegex = /^( \w+: (["'][^"']*["']|\d+|false|true),?)+ $/
const chunkSubstrFormat = ` webpackChunkName: ["']${webpackChunknameFormat}["'],? `
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

these don't use backreferences, so mismatched quotes would be supported. I see the test cases that suggest they aren't supported, but i'm not clear on how that works. can you help me understand?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had the same thought at first! The gist is that mismatched quotes are invalid syntax, so they trigger the syntax error and don't need to be checked in the style regex. I can use backreferences in these patterns instead, if you prefer to have it covered both ways, just lmk :)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's inside a comment tho, so I'm not sure why it'd be invalid syntax?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The comment value is parsed as the interior of a JS object literal, in order to validate the syntax: https://github.com/benmosher/eslint-plugin-import/blob/274b252138aa6c268db9084875f024b45c4eb9c5/src/rules/dynamic-import-chunkname.js#L72

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd prefer the backreferences, but it doesn't need to block the PR.

@coveralls
Copy link

coveralls commented Jul 7, 2020

Coverage Status

Coverage remained the same at 97.905% when pulling 227d9a2 on straub:fix/dynamic-import-chunkname-single-quotes into 569d726 on benmosher:master.

@coveralls
Copy link

Coverage Status

Coverage remained the same at 97.857% when pulling 274b252 on straub:fix/dynamic-import-chunkname-single-quotes into 843055c on benmosher:master.

2 similar comments
@coveralls
Copy link

Coverage Status

Coverage remained the same at 97.857% when pulling 274b252 on straub:fix/dynamic-import-chunkname-single-quotes into 843055c on benmosher:master.

@coveralls
Copy link

Coverage Status

Coverage remained the same at 97.857% when pulling 274b252 on straub:fix/dynamic-import-chunkname-single-quotes into 843055c on benmosher:master.

@straub
Copy link
Contributor Author

straub commented Jul 8, 2020

I'm concerned about webpack users prior to v4.43.0 getting false positives here.

Sorry for the confusion here, I only meant to confirm that single quotes are supported in 4.43.0 (their latest as of now), but I'm sure the support extends back farther than that since I've used single quotes for some time. It struck me as tangential to the purpose of this rule about the format of the chunkName to get too deep in the weeds of Webpack support, but I see what you're saying. If you think it's important, I can attempt to find out how far back Webpack support for single quotes goes.

@straub
Copy link
Contributor Author

straub commented Jul 8, 2020

I ran a quick test, and the single quotes are supported in Webpack all the way back to v2.4.0, which as I understand it is the release that introduced magic comments. Given that, there wouldn't seem much value in a "detect" option.

Please let me know how you'd like to proceed, and thanks for your feedback so far!

@ljharb
Copy link
Member

ljharb commented Jul 8, 2020

I totally agree, thanks for doing the research.

@straub
Copy link
Contributor Author

straub commented Jul 10, 2020

@ljharb Did you still want me to pursue adding a true/false option, or any other changes?

@straub straub requested a review from ljharb July 15, 2020 21:30
@ljharb
Copy link
Member

ljharb commented Aug 30, 2020

@straub sorry for the delay :-) let me take a fresh look now.

Comment on lines +33 to +34
const commentStyleRegex = /^( \w+: (["'][^"']*["']|\d+|false|true),?)+ $/
const chunkSubstrFormat = ` webpackChunkName: ["']${webpackChunknameFormat}["'],? `
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd prefer the backreferences, but it doesn't need to block the PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

Why force specific quotes in dynamic-import-chunkname?
3 participants