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

feat: use template literal when it possible to prevent `Maximum call … #1525

Merged
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 2 additions & 1 deletion .cspell.json
Expand Up @@ -36,7 +36,8 @@
"Brotli",
"Contex",
"vspace",
"commitlint"
"commitlint",
"eslintcache"
],

"ignorePaths": [
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -14,6 +14,7 @@ npm-debug.log*
/test/fixtures/modules/composes/composes-absolute.css
/test/fixtures/import/import-file-protocol.css
/test/fixtures/url/url-file-protocol.css
/test/fixtures/url/many-urls.css

.DS_Store
Thumbs.db
Expand Down
68 changes: 58 additions & 10 deletions src/utils.js
Expand Up @@ -1034,7 +1034,26 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
)}`;
}

let code = JSON.stringify(result.css);
let isTemplateLiteralSupported = false;

if (
// eslint-disable-next-line no-underscore-dangle
loaderContext._compilation &&
// eslint-disable-next-line no-underscore-dangle
loaderContext._compilation.options &&
// eslint-disable-next-line no-underscore-dangle
loaderContext._compilation.options.output &&
// eslint-disable-next-line no-underscore-dangle
loaderContext._compilation.options.output.environment &&
// eslint-disable-next-line no-underscore-dangle
loaderContext._compilation.options.output.environment.templateLiteral
) {
isTemplateLiteralSupported = true;
}

let code = isTemplateLiteralSupported
? convertToTemplateLiteral(result.css)
: JSON.stringify(result.css);

let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${
options.sourceMap
Expand Down Expand Up @@ -1067,12 +1086,21 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
if (localName) {
code = code.replace(new RegExp(replacementName, "g"), () =>
options.modules.namedExport
? `" + ${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}] + "`
? isTemplateLiteralSupported
? `\${ ${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}] }`
: `" + ${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}] + "`
: isTemplateLiteralSupported
? `\${${importName}.locals[${JSON.stringify(localName)}]}`
: `" + ${importName}.locals[${JSON.stringify(localName)}] + "`
);
} else {
Expand All @@ -1084,9 +1112,10 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
getUrlOptions.length > 0 ? `, { ${getUrlOptions.join(", ")} }` : "";

beforeCode += `var ${replacementName} = ___CSS_LOADER_GET_URL_IMPORT___(${importName}${preparedOptions});\n`;
code = code.replace(
new RegExp(replacementName, "g"),
() => `" + ${replacementName} + "`
code = code.replace(new RegExp(replacementName, "g"), () =>
isTemplateLiteralSupported
? `\${${replacementName}}`
: `" + ${replacementName} + "`
);
}
}
Expand All @@ -1101,6 +1130,25 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
return `${beforeCode}// Module\n___CSS_LOADER_EXPORT___.push([module.id, ${code}, ""${sourceMapValue}]);\n`;
}

const SLASH = "\\".charCodeAt(0);
const BACKTICK = "`".charCodeAt(0);
const DOLLAR = "$".charCodeAt(0);

function convertToTemplateLiteral(str) {
let escapedString = "";

for (let i = 0; i < str.length; i++) {
const code = str.charCodeAt(i);

escapedString +=
code === SLASH || code === BACKTICK || code === DOLLAR
? `\\${str[i]}`
: str[i];
}

return `\`${escapedString}\``;
}

function dashesCamelCase(str) {
return str.replace(/-+(\w)/g, (match, firstLetter) =>
firstLetter.toUpperCase()
Expand Down
105 changes: 64 additions & 41 deletions test/__snapshots__/exportType.test.js.snap

Large diffs are not rendered by default.

500 changes: 439 additions & 61 deletions test/__snapshots__/loader.test.js.snap

Large diffs are not rendered by default.