diff --git a/docs/rules/dynamic-import-chunkname.md b/docs/rules/dynamic-import-chunkname.md index 4bcc5a98b1..d29c06bbaa 100644 --- a/docs/rules/dynamic-import-chunkname.md +++ b/docs/rules/dynamic-import-chunkname.md @@ -39,12 +39,6 @@ import( 'someModule', ); -// using single quotes instead of double quotes -import( - /* webpackChunkName: 'someModule' */ - 'someModule', -); - // invalid syntax for webpack comment import( /* totally not webpackChunkName: "someModule" */ @@ -78,6 +72,12 @@ The following patterns are valid: /* webpackChunkName: "someModule", webpackPrefetch: true */ 'someModule', ); + + // using single quotes instead of double quotes + import( + /* webpackChunkName: 'someModule' */ + 'someModule', + ); ``` ## When Not To Use It diff --git a/src/rules/dynamic-import-chunkname.js b/src/rules/dynamic-import-chunkname.js index cff4b1c2a1..5ac89e1e64 100644 --- a/src/rules/dynamic-import-chunkname.js +++ b/src/rules/dynamic-import-chunkname.js @@ -30,8 +30,8 @@ module.exports = { const { webpackChunknameFormat = '[0-9a-zA-Z-_/.]+' } = config || {} const paddedCommentRegex = /^ (\S[\s\S]+\S) $/ - const commentStyleRegex = /^( \w+: ("[^"]*"|\d+|false|true),?)+ $/ - const chunkSubstrFormat = ` webpackChunkName: "${webpackChunknameFormat}",? ` + const commentStyleRegex = /^( \w+: (["'][^"']*["']|\d+|false|true),?)+ $/ + const chunkSubstrFormat = ` webpackChunkName: ["']${webpackChunknameFormat}["'],? ` const chunkSubstrRegex = new RegExp(chunkSubstrFormat) function run(node, arg) { diff --git a/tests/src/rules/dynamic-import-chunkname.js b/tests/src/rules/dynamic-import-chunkname.js index 938f542e91..cd321019d2 100644 --- a/tests/src/rules/dynamic-import-chunkname.js +++ b/tests/src/rules/dynamic-import-chunkname.js @@ -21,8 +21,8 @@ const noLeadingCommentError = 'dynamic imports require a leading comment with th const nonBlockCommentError = 'dynamic imports require a /* foo */ style comment, not a // foo comment' const noPaddingCommentError = 'dynamic imports require a block comment padded with spaces - /* foo */' const invalidSyntaxCommentError = 'dynamic imports require a "webpack" comment with valid syntax' -const commentFormatError = `dynamic imports require a leading comment in the form /* webpackChunkName: "${commentFormat}",? */` -const pickyCommentFormatError = `dynamic imports require a leading comment in the form /* webpackChunkName: "${pickyCommentFormat}",? */` +const commentFormatError = `dynamic imports require a leading comment in the form /* webpackChunkName: ["']${commentFormat}["'],? */` +const pickyCommentFormatError = `dynamic imports require a leading comment in the form /* webpackChunkName: ["']${pickyCommentFormat}["'],? */` ruleTester.run('dynamic-import-chunkname', rule, { valid: [ @@ -132,6 +132,14 @@ ruleTester.run('dynamic-import-chunkname', rule, { options, parser, }, + { + code: `import( + /* webpackChunkName: 'someModule' */ + 'someModule' + )`, + options, + parser, + }, { code: `import( /* webpackChunkName: "someModule" */ @@ -192,17 +200,33 @@ ruleTester.run('dynamic-import-chunkname', rule, { }, { code: `import( - /* webpackChunkName: 'someModule' */ + /* webpackChunkName: "someModule' */ 'someModule' )`, options, parser, output: `import( - /* webpackChunkName: 'someModule' */ + /* webpackChunkName: "someModule' */ 'someModule' )`, errors: [{ - message: commentFormatError, + message: invalidSyntaxCommentError, + type: 'CallExpression', + }], + }, + { + code: `import( + /* webpackChunkName: 'someModule" */ + 'someModule' + )`, + options, + parser, + output: `import( + /* webpackChunkName: 'someModule" */ + 'someModule' + )`, + errors: [{ + message: invalidSyntaxCommentError, type: 'CallExpression', }], }, @@ -421,21 +445,6 @@ ruleTester.run('dynamic-import-chunkname', rule, { type: 'CallExpression', }], }, - { - code: `dynamicImport( - /* webpackChunkName: 'someModule' */ - 'someModule' - )`, - options, - output: `dynamicImport( - /* webpackChunkName: 'someModule' */ - 'someModule' - )`, - errors: [{ - message: commentFormatError, - type: 'CallExpression', - }], - }, { code: `dynamicImport( /* webpackChunkName "someModule" */ @@ -578,6 +587,14 @@ context('TypeScript', () => { type: nodeType, }], }, + { + code: `import( + /* webpackChunkName: 'someModule' */ + 'test' + )`, + options, + parser: typescriptParser, + }, ], invalid: [ { @@ -624,17 +641,33 @@ context('TypeScript', () => { }, { code: `import( - /* webpackChunkName: 'someModule' */ + /* webpackChunkName "someModule' */ 'someModule' )`, options, parser: typescriptParser, output: `import( - /* webpackChunkName: 'someModule' */ + /* webpackChunkName "someModule' */ 'someModule' )`, errors: [{ - message: commentFormatError, + message: invalidSyntaxCommentError, + type: nodeType, + }], + }, + { + code: `import( + /* webpackChunkName 'someModule" */ + 'someModule' + )`, + options, + parser: typescriptParser, + output: `import( + /* webpackChunkName 'someModule" */ + 'someModule' + )`, + errors: [{ + message: invalidSyntaxCommentError, type: nodeType, }], },