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.

Sign up for GitHub

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

Jump to bottom

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

Merged
merged 5 commits into from
May 27, 2023
Merged

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

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
88bc11e
feat: use template literal when it possible to prevent `Maximum call …
alexander-akait May 27, 2023
b4d4fe8
test: revert
alexander-akait May 27, 2023
3aadcc0
test: more
alexander-akait May 27, 2023
3795ad4
test: more
alexander-akait May 27, 2023
1b55942
refactor: code
alexander-akait May 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .cspell.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,8 @@
"Brotli",
"Contex",
"vspace",
"commitlint"
"commitlint",
"eslintcache"
],

"ignorePaths": [
Expand Down
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
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
29 changes: 27 additions & 2 deletions src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -227,12 +227,36 @@ export default async function loader(content, map, meta) {
}
}

let isTemplateLiteralSupported = false;

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

const importCode = getImportCode(imports, options);

let moduleCode;

try {
moduleCode = getModuleCode(result, api, replacements, options, this);
moduleCode = getModuleCode(
result,
api,
replacements,
options,
isTemplateLiteralSupported,
this
);
} catch (error) {
callback(error);

Expand All @@ -243,7 +267,8 @@ export default async function loader(content, map, meta) {
exports,
replacements,
needToUseIcssPlugin,
options
options,
isTemplateLiteralSupported
);

callback(null, `${importCode}${moduleCode}${exportCode}`);
Expand Down
114 changes: 89 additions & 25 deletions src/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1018,7 +1018,14 @@ function printParams(media, dedupe, supports, layer) {
return result;
}

function getModuleCode(result, api, replacements, options, loaderContext) {
function getModuleCode(
result,
api,
replacements,
options,
isTemplateLiteralSupported,
loaderContext
) {
if (options.modules.exportOnlyLocals === true) {
return "";
}
Expand All @@ -1034,7 +1041,9 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
)}`;
}

let code = JSON.stringify(result.css);
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 +1076,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 +1102,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,13 +1120,38 @@ 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()
);
}

function getExportCode(exports, replacements, icssPluginUsed, options) {
function getExportCode(
exports,
replacements,
icssPluginUsed,
options,
isTemplateLiteralSupported
) {
let code = "// Exports\n";

if (icssPluginUsed) {
Expand All @@ -1120,13 +1164,21 @@ function getExportCode(exports, replacements, icssPluginUsed, options) {

for (const name of normalizedNames) {
if (options.modules.namedExport) {
localsCode += `export var ${name} = ${JSON.stringify(value)};\n`;
localsCode += `export var ${name} = ${
isTemplateLiteralSupported
? convertToTemplateLiteral(value)
: JSON.stringify(value)
};\n`;
} else {
if (localsCode) {
localsCode += `,\n`;
}

localsCode += `\t${JSON.stringify(name)}: ${JSON.stringify(value)}`;
localsCode += `\t${JSON.stringify(name)}: ${
isTemplateLiteralSupported
? convertToTemplateLiteral(value)
: JSON.stringify(value)
}`;
}
}
};
Expand All @@ -1148,23 +1200,35 @@ function getExportCode(exports, replacements, icssPluginUsed, options) {
new RegExp(replacementName, "g"),
() => {
if (options.modules.namedExport) {
return `" + ${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}] + "`;
return isTemplateLiteralSupported
? `\${${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}]}`
: `" + ${importName}_NAMED___[${JSON.stringify(
getValidLocalName(
localName,
options.modules.exportLocalsConvention
)
)}] + "`;
} else if (options.modules.exportOnlyLocals) {
return `" + ${importName}[${JSON.stringify(localName)}] + "`;
return isTemplateLiteralSupported
? `\${${importName}[${JSON.stringify(localName)}]}`
: `" + ${importName}[${JSON.stringify(localName)}] + "`;
}

return `" + ${importName}.locals[${JSON.stringify(localName)}] + "`;
return isTemplateLiteralSupported
? `\${${importName}.locals[${JSON.stringify(localName)}]}`
: `" + ${importName}.locals[${JSON.stringify(localName)}] + "`;
}
);
} else {
localsCode = localsCode.replace(
new RegExp(replacementName, "g"),
() => `" + ${replacementName} + "`
localsCode = localsCode.replace(new RegExp(replacementName, "g"), () =>
isTemplateLiteralSupported
? `\${${replacementName}}`
: `" + ${replacementName} + "`
);
}
}
Expand Down
Loading