Skip to content

Commit

Permalink
fix(perf): avoid using klona for postcss options (#658)
Browse files Browse the repository at this point in the history
  • Loading branch information
alexander-akait authored Jun 9, 2023
1 parent 69446c3 commit e754c3f
Show file tree
Hide file tree
Showing 5 changed files with 70 additions and 20 deletions.
1 change: 0 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,6 @@
"dependencies": {
"cosmiconfig": "^8.1.3",
"jiti": "^1.18.2",
"klona": "^2.0.6",
"semver": "^7.3.8"
},
"devDependencies": {
Expand Down
10 changes: 5 additions & 5 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -75,17 +75,17 @@ export default async function loader(content, sourceMap, meta) {
}
}

const useSourceMap =
typeof options.sourceMap !== "undefined"
? options.sourceMap
: this.sourceMap;

const { plugins, processOptions } = await getPostcssOptions(
this,
loadedConfig,
options.postcssOptions
);

const useSourceMap =
typeof options.sourceMap !== "undefined"
? options.sourceMap
: this.sourceMap;

if (useSourceMap) {
processOptions.map = {
inline: false,
Expand Down
26 changes: 12 additions & 14 deletions src/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import path from "path";
import url from "url";
import Module from "module";

import { klona } from "klona/full";
import { cosmiconfig, defaultLoaders } from "cosmiconfig";

const parentModule = module;
Expand Down Expand Up @@ -185,11 +184,9 @@ async function loadConfig(loaderContext, config, postcssOptions) {
options: postcssOptions || {},
};

result.config = result.config(api);
return { ...result, config: result.config(api) };
}

result = klona(result);

return result;
}

Expand Down Expand Up @@ -330,7 +327,7 @@ async function getPostcssOptions(
loaderContext.emitError(error);
}

const processOptionsFromConfig = loadedConfig.config || {};
const processOptionsFromConfig = { ...loadedConfig.config } || {};

if (processOptionsFromConfig.from) {
processOptionsFromConfig.from = path.resolve(
Expand All @@ -346,10 +343,7 @@ async function getPostcssOptions(
);
}

// No need them for processOptions
delete processOptionsFromConfig.plugins;

const processOptionsFromOptions = klona(normalizedPostcssOptions);
const processOptionsFromOptions = { ...normalizedPostcssOptions };

if (processOptionsFromOptions.from) {
processOptionsFromOptions.from = path.resolve(
Expand All @@ -365,16 +359,20 @@ async function getPostcssOptions(
);
}

// No need them for processOptions
delete processOptionsFromOptions.config;
delete processOptionsFromOptions.plugins;
// No need `plugins` and `config` for processOptions
const { plugins: __plugins, ...optionsFromConfig } = processOptionsFromConfig;
const {
config: _config,
plugins: _plugins,
...optionsFromOptions
} = processOptionsFromOptions;

const processOptions = {
from: file,
to: file,
map: false,
...processOptionsFromConfig,
...processOptionsFromOptions,
...optionsFromConfig,
...optionsFromOptions,
};

if (typeof processOptions.parser === "string") {
Expand Down
14 changes: 14 additions & 0 deletions test/__snapshots__/postcssOptions.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -213,6 +213,20 @@ exports[`"postcssOptions" option should work "Function" value: errors 1`] = `[]`

exports[`"postcssOptions" option should work "Function" value: warnings 1`] = `[]`;

exports[`"postcssOptions" option should work and don't modify postcss options: css 1`] = `
"a { color: black }
.foo {
float: right;
}
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZyb20uY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLElBQUksYUFBYTs7QUFFakI7RUFDRSxZQUFZO0FBQ2QiLCJmaWxlIjoidG8uY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYSB7IGNvbG9yOiBibGFjayB9XG5cbi5mb28ge1xuICBmbG9hdDogcmlnaHQ7XG59XG4iXX0= */"
`;

exports[`"postcssOptions" option should work and don't modify postcss options: errors 1`] = `[]`;

exports[`"postcssOptions" option should work and don't modify postcss options: warnings 1`] = `[]`;

exports[`"postcssOptions" option should work and provide API for the configuration: css 1`] = `
"a {
color: black;
Expand Down
39 changes: 39 additions & 0 deletions test/postcssOptions.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -841,9 +841,48 @@ describe('"postcssOptions" option', () => {
},
});
const stats = await compile(compiler);
const codeFromBundle = getCodeFromBundle("style.css", stats);

expect(codeFromBundle.css).toMatchSnapshot("css");
expect(getWarnings(stats)).toMatchSnapshot("warnings");
expect(getErrors(stats)).toMatchSnapshot("errors");
});

it("should work and don't modify postcss options", async () => {
const postcssOptions = {
config: path.resolve(__dirname, "./fixtures/css/plugins.config.js"),
from: "from.css",
map: {
inline: true,
},
parser: "postcss/lib/parse",
stringifier: "postcss/lib/stringify",
to: "to.css",
plugins: [require.resolve("./fixtures/plugin/new-api.plugin")],
};
const compiler = getCompiler(
"./config-scope/css/index.js",
{
postcssOptions,
},
{
devtool: "source-map",
}
);
const stats = await compile(compiler);
const codeFromBundle = getCodeFromBundle("style.css", stats);

expect(postcssOptions).toEqual({
config: path.resolve(__dirname, "./fixtures/css/plugins.config.js"),
from: "from.css",
map: {
inline: true,
},
parser: "postcss/lib/parse",
stringifier: "postcss/lib/stringify",
to: "to.css",
plugins: [require.resolve("./fixtures/plugin/new-api.plugin")],
});
expect(codeFromBundle.css).toMatchSnapshot("css");
expect(getWarnings(stats)).toMatchSnapshot("warnings");
expect(getErrors(stats)).toMatchSnapshot("errors");
Expand Down

0 comments on commit e754c3f

Please sign in to comment.