Skip to content

Commit

Permalink
Merge branch 'master' into master
Browse files Browse the repository at this point in the history
  • Loading branch information
David Liu committed Mar 20, 2020
2 parents 723f3d9 + fe0e6c9 commit f1b4136
Show file tree
Hide file tree
Showing 8 changed files with 271 additions and 307 deletions.
2 changes: 1 addition & 1 deletion src/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ export default function loader(content, map, meta) {
esModule
);

return callback(null, [importCode, moduleCode, exportCode].join(''));
return callback(null, `${importCode}${moduleCode}${exportCode}`);
})
.catch((error) => {
callback(
Expand Down
154 changes: 73 additions & 81 deletions src/plugins/postcss-import-parser.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,111 +6,103 @@ import { normalizeUrl } from '../utils';

const pluginName = 'postcss-import-parser';

function getParsedValue(node) {
if (node.type === 'function' && node.value.toLowerCase() === 'url') {
const { nodes } = node;
const isStringValue = nodes.length !== 0 && nodes[0].type === 'string';
const url = isStringValue ? nodes[0].value : valueParser.stringify(nodes);

return { url, isStringValue };
}

if (node.type === 'string') {
const url = node.value;

return { url, isStringValue: true };
}

return null;
}

function parseImport(params) {
const { nodes } = valueParser(params);

if (nodes.length === 0) {
return null;
}

const value = getParsedValue(nodes[0]);

if (!value) {
return null;
}

let { url } = value;

if (url.trim().length === 0) {
return null;
}

if (isUrlRequest(url)) {
const { isStringValue } = value;

url = normalizeUrl(url, isStringValue);
}

return {
url,
media: valueParser
.stringify(nodes.slice(1))
.trim()
.toLowerCase(),
};
}

function walkAtRules(css, result, filter) {
const items = [];

export default postcss.plugin(pluginName, (options) => (css, result) => {
css.walkAtRules(/^import$/i, (atRule) => {
// Convert only top-level @import
if (atRule.parent.type !== 'root') {
return;
}

// Nodes do not exists - `@import url('http://') :root {}`
if (atRule.nodes) {
result.warn(
"It looks like you didn't end your @import statement correctly. " +
'Child nodes are attached to it.',
"It looks like you didn't end your @import statement correctly. Child nodes are attached to it.",
{ node: atRule }
);

return;
}

const parsed = parseImport(atRule.params);
const { nodes } = valueParser(atRule.params);

if (!parsed) {
// eslint-disable-next-line consistent-return
return result.warn(`Unable to find uri in '${atRule.toString()}'`, {
// No nodes - `@import ;`
// Invalid type - `@import foo-bar;`
if (
nodes.length === 0 ||
(nodes[0].type !== 'string' && nodes[0].type !== 'function')
) {
result.warn(`Unable to find uri in "${atRule.toString()}"`, {
node: atRule,
});
}

if (filter && !filter(parsed)) {
return;
}

atRule.remove();
let isStringValue;
let url;

if (nodes[0].type === 'string') {
isStringValue = true;
url = nodes[0].value;
} else if (nodes[0].type === 'function') {
// Invalid function - `@import nourl(test.css);`
if (nodes[0].value.toLowerCase() !== 'url') {
result.warn(`Unable to find uri in "${atRule.toString()}"`, {
node: atRule,
});

items.push(parsed);
});
return;
}

isStringValue =
nodes[0].nodes.length !== 0 && nodes[0].nodes[0].type === 'string';
url = isStringValue
? nodes[0].nodes[0].value
: valueParser.stringify(nodes[0].nodes);
}

// Empty url - `@import "";` or `@import url();`
if (url.trim().length === 0) {
result.warn(`Unable to find uri in "${atRule.toString()}"`, {
node: atRule,
});

return items;
}
return;
}

export default postcss.plugin(
pluginName,
(options) =>
function process(css, result) {
const items = walkAtRules(css, result, options.filter);
const isRequestable = isUrlRequest(url);

items.forEach((item) => {
const { url, media } = item;
if (isRequestable) {
url = normalizeUrl(url, isStringValue);

result.messages.push({
pluginName,
type: 'import',
value: { type: '@import', url, media },
// Empty url after normalize - `@import '\
// \
// \
// ';
if (url.trim().length === 0) {
result.warn(`Unable to find uri in "${atRule.toString()}"`, {
node: atRule,
});
});

return;
}
}
);

const media = valueParser
.stringify(nodes.slice(1))
.trim()
.toLowerCase();

if (options.filter && !options.filter({ url, media })) {
return;
}

atRule.remove();

result.messages.push({
pluginName,
type: 'import',
value: { type: '@import', isRequestable, url, media },
});
});
});
164 changes: 58 additions & 106 deletions src/plugins/postcss-url-parser.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,128 +59,80 @@ function walkUrls(parsed, callback) {
});
}

function getUrlsFromValue(value, result, filter, decl) {
if (!needParseDecl.test(value)) {
return;
}

const parsed = valueParser(value);
const urls = [];

walkUrls(parsed, (node, url, needQuotes, isStringValue) => {
if (url.trim().replace(/\\[\r\n]/g, '').length === 0) {
result.warn(`Unable to find uri in '${decl ? decl.toString() : value}'`, {
node: decl,
});

return;
}
export default postcss.plugin(pluginName, (options) => (css, result) => {
const importsMap = new Map();
const replacersMap = new Map();

if (filter && !filter(url)) {
css.walkDecls((decl) => {
if (!needParseDecl.test(decl.value)) {
return;
}

const splittedUrl = url.split(/(\?)?#/);
const [urlWithoutHash, singleQuery, hashValue] = splittedUrl;
const hash =
singleQuery || hashValue
? `${singleQuery ? '?' : ''}${hashValue ? `#${hashValue}` : ''}`
: '';

const normalizedUrl = normalizeUrl(urlWithoutHash, isStringValue);

urls.push({ node, url: normalizedUrl, hash, needQuotes });
});

// eslint-disable-next-line consistent-return
return { parsed, urls };
}

function walkDecls(css, result, filter) {
const items = [];
const parsed = valueParser(decl.value);

css.walkDecls((decl) => {
const item = getUrlsFromValue(decl.value, result, filter, decl);
walkUrls(parsed, (node, url, needQuotes, isStringValue) => {
if (url.trim().replace(/\\[\r\n]/g, '').length === 0) {
result.warn(
`Unable to find uri in '${decl ? decl.toString() : decl.value}'`,
{ node: decl }
);

if (!item || item.urls.length === 0) {
return;
}
return;
}

items.push({ decl, parsed: item.parsed, urls: item.urls });
});
if (options.filter && !options.filter(url)) {
return;
}

return items;
}
const splittedUrl = url.split(/(\?)?#/);
const [urlWithoutHash, singleQuery, hashValue] = splittedUrl;
const hash =
singleQuery || hashValue
? `${singleQuery ? '?' : ''}${hashValue ? `#${hashValue}` : ''}`
: '';

function flatten(array) {
return array.reduce((a, b) => a.concat(b), []);
}
const normalizedUrl = normalizeUrl(urlWithoutHash, isStringValue);

function collectUniqueUrlsWithNodes(array) {
return array.reduce((accumulator, currentValue) => {
const { url, needQuotes, hash, node } = currentValue;
const found = accumulator.find(
(item) =>
url === item.url && needQuotes === item.needQuotes && hash === item.hash
);

if (!found) {
accumulator.push({ url, hash, needQuotes, nodes: [node] });
} else {
found.nodes.push(node);
}
const importKey = normalizedUrl;
let importName = importsMap.get(importKey);

return accumulator;
}, []);
}
if (!importName) {
importName = `___CSS_LOADER_URL_IMPORT_${importsMap.size}___`;
importsMap.set(importKey, importName);

export default postcss.plugin(
pluginName,
(options) =>
function process(css, result) {
const traversed = walkDecls(css, result, options.filter);
const flattenTraversed = flatten(traversed.map((item) => item.urls));
const urlsWithNodes = collectUniqueUrlsWithNodes(flattenTraversed);
const replacers = new Map();

urlsWithNodes.forEach((urlWithNodes, index) => {
const { url, hash, needQuotes, nodes } = urlWithNodes;
const replacementName = `___CSS_LOADER_URL_REPLACEMENT_${index}___`;

result.messages.push(
{
pluginName,
type: 'import',
value: { type: 'url', replacementName, url, needQuotes, hash },
result.messages.push({
pluginName,
type: 'import',
value: {
type: 'url',
importName,
url: normalizedUrl,
},
{
pluginName,
type: 'replacer',
value: { type: 'url', replacementName },
}
);

nodes.forEach((node) => {
replacers.set(node, replacementName);
});
});
}

traversed.forEach((item) => {
walkUrls(item.parsed, (node) => {
const replacementName = replacers.get(node);
const replacerKey = JSON.stringify({ importKey, hash, needQuotes });

if (!replacementName) {
return;
}
let replacerName = replacersMap.get(replacerKey);

// eslint-disable-next-line no-param-reassign
node.type = 'word';
// eslint-disable-next-line no-param-reassign
node.value = replacementName;
if (!replacerName) {
replacerName = `___CSS_LOADER_URL_REPLACEMENT_${replacersMap.size}___`;
replacersMap.set(replacerKey, replacerName);

result.messages.push({
pluginName,
type: 'replacer',
value: { type: 'url', replacerName, importName, hash, needQuotes },
});
}

// eslint-disable-next-line no-param-reassign
item.decl.value = item.parsed.toString();
});
}
);
// eslint-disable-next-line no-param-reassign
node.type = 'word';
// eslint-disable-next-line no-param-reassign
node.value = replacerName;
});

// eslint-disable-next-line no-param-reassign
decl.value = parsed.toString();
});
});

0 comments on commit f1b4136

Please sign in to comment.