From 261f70edaaa2435f3fe2637abadba2e6a84dc1a9 Mon Sep 17 00:00:00 2001 From: Alexander Akait <4567934+alexander-akait@users.noreply.github.com> Date: Fri, 9 Jun 2023 01:42:47 +0300 Subject: [PATCH] fix(perf): avoud using `clona` for `stylus` options (#394) --- package.json | 1 - src/index.js | 2 +- src/utils.js | 26 ++++++------ test/__snapshots__/loader.test.js.snap | 16 ++++++++ .../sourceMap-options.test.js.snap | 16 ++++++++ test/loader.test.js | 41 ++++++++++++++++++- test/sourceMap-options.test.js | 19 +++++++++ 7 files changed, 104 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index 0bbc3f9..8e646ae 100644 --- a/package.json +++ b/package.json @@ -46,7 +46,6 @@ }, "dependencies": { "fast-glob": "^3.2.12", - "klona": "^2.0.6", "normalize-path": "^3.0.0" }, "devDependencies": { diff --git a/src/index.js b/src/index.js index fdc4af8..5958bd3 100644 --- a/src/index.js +++ b/src/index.js @@ -66,7 +66,7 @@ export default async function stylusLoader(source) { const useSourceMap = typeof options.sourceMap === "boolean" ? options.sourceMap : this.sourceMap; - if (stylusOptions.sourcemap || useSourceMap) { + if (useSourceMap || stylusOptions.sourcemap) { styl.set( "sourcemap", useSourceMap diff --git a/src/utils.js b/src/utils.js index 533c0b7..eca56d0 100644 --- a/src/utils.js +++ b/src/utils.js @@ -3,7 +3,6 @@ import path from "path"; import { Parser, Compiler, Evaluator, nodes, utils } from "stylus"; import DepsResolver from "stylus/lib/visitor/deps-resolver"; -import { klona } from "klona/full"; import fastGlob from "fast-glob"; import normalizePath from "normalize-path"; @@ -23,25 +22,26 @@ function isProductionLikeMode(loaderContext) { } function getStylusOptions(loaderContext, loaderOptions) { - const stylusOptions = klona( + const options = typeof loaderOptions.stylusOptions === "function" ? loaderOptions.stylusOptions(loaderContext) || {} - : loaderOptions.stylusOptions || {} - ); - - stylusOptions.filename = loaderContext.resourcePath; - stylusOptions.dest = path.dirname(loaderContext.resourcePath); - - // Keep track of imported files (used by Stylus CLI watch mode) - // eslint-disable-next-line no-underscore-dangle - stylusOptions._imports = []; + : loaderOptions.stylusOptions || {}; + const stylusOptions = { + filename: loaderContext.resourcePath, + dest: path.dirname(loaderContext.resourcePath), + ...options, + // Keep track of imported files (used by Stylus CLI watch mode) + // eslint-disable-next-line no-underscore-dangle + // Don't allow to override, because it is internally + _imports: [], + }; // https://github.com/stylus/stylus/issues/2119 stylusOptions.resolveURL = typeof stylusOptions.resolveURL === "boolean" && !stylusOptions.resolveURL ? false : typeof stylusOptions.resolveURL === "object" - ? stylusOptions.resolveURL + ? { ...stylusOptions.resolveURL } : { nocheck: true }; if ( @@ -182,7 +182,7 @@ async function getDependencies( seen.add(filename); // See https://github.com/stylus/stylus/issues/2108 - const newOptions = klona({ ...options, filename, cache: false }); + const newOptions = { ...options, filename, cache: false }; const parser = new Parser(code, newOptions); let ast; diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index e3a3e04..897db54 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -954,6 +954,22 @@ exports[`loader should work "use" option: errors 1`] = `[]`; exports[`loader should work "use" option: warnings 1`] = `[]`; +exports[`loader should work and don't override loader options: css 1`] = ` +"body { + font: 12px Helvetica, Arial, sans-serif; +} +a.button { + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImJhc2ljLnN0eWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS0E7RUFDRSxNQUFtQixrQ0FBbkI7O0FBRUY7RUFQRSx1QkFBc0IsSUFBdEI7RUFDQSxvQkFBbUIsSUFBbkI7RUFDQSxlQUFjLElBQWQiLCJmaWxlIjoiYmFzaWMuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYm9yZGVyLXJhZGl1cygpXG4gIC13ZWJraXQtYm9yZGVyLXJhZGl1cyBhcmd1bWVudHNcbiAgLW1vei1ib3JkZXItcmFkaXVzIGFyZ3VtZW50c1xuICBib3JkZXItcmFkaXVzIGFyZ3VtZW50c1xuXG5ib2R5XG4gIGZvbnQgMTJweCBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmXG5cbmEuYnV0dG9uXG4gIGJvcmRlci1yYWRpdXMgNXB4Il19 */" +`; + +exports[`loader should work and don't override loader options: errors 1`] = `[]`; + +exports[`loader should work and don't override loader options: warnings 1`] = `[]`; + exports[`loader should work and respect the "compress" option with the "false" value: css 1`] = ` "body { font: 12px Helvetica, Arial, sans-serif; diff --git a/test/__snapshots__/sourceMap-options.test.js.snap b/test/__snapshots__/sourceMap-options.test.js.snap index f45d7c7..cc4a6c7 100644 --- a/test/__snapshots__/sourceMap-options.test.js.snap +++ b/test/__snapshots__/sourceMap-options.test.js.snap @@ -289,3 +289,19 @@ a.button { exports[`"sourceMap" options should not generate source maps when value is "false": errors 1`] = `[]`; exports[`"sourceMap" options should not generate source maps when value is "false": warnings 1`] = `[]`; + +exports[`"sourceMap" options should work and allow to override source maps options: css 1`] = ` +"body { + font: 12px Helvetica, Arial, sans-serif; +} +a.button { + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImJhc2ljLnN0eWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS0E7RUFDRSxNQUFtQixrQ0FBbkI7O0FBRUY7RUFQRSx1QkFBc0IsSUFBdEI7RUFDQSxvQkFBbUIsSUFBbkI7RUFDQSxlQUFjLElBQWQiLCJmaWxlIjoiYmFzaWMuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYm9yZGVyLXJhZGl1cygpXG4gIC13ZWJraXQtYm9yZGVyLXJhZGl1cyBhcmd1bWVudHNcbiAgLW1vei1ib3JkZXItcmFkaXVzIGFyZ3VtZW50c1xuICBib3JkZXItcmFkaXVzIGFyZ3VtZW50c1xuXG5ib2R5XG4gIGZvbnQgMTJweCBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmXG5cbmEuYnV0dG9uXG4gIGJvcmRlci1yYWRpdXMgNXB4Il19 */" +`; + +exports[`"sourceMap" options should work and allow to override source maps options: errors 1`] = `[]`; + +exports[`"sourceMap" options should work and allow to override source maps options: warnings 1`] = `[]`; diff --git a/test/loader.test.js b/test/loader.test.js index 2a9089b..4de56c8 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -249,7 +249,7 @@ describe("loader", () => { const testId = "./shallow-deep-literal.styl"; const compiler = getCompiler(testId, { stylusOptions: { - dest: "deep/deep-literal.css", + dest: path.resolve(__dirname, "fixtures/"), }, }); const stats = await compile(compiler); @@ -257,7 +257,7 @@ describe("loader", () => { const codeFromStylus = await getCodeFromStylus(testId, { stylusOptions: { resolveURL: { nocheck: true }, - dest: "deep/deep-literal.css", + dest: path.resolve(__dirname, "fixtures/"), }, }); @@ -1792,4 +1792,41 @@ describe("loader", () => { expect(getWarnings(stats)).toMatchSnapshot("warnings"); expect(getErrors(stats)).toMatchSnapshot("errors"); }); + + it("should work and don't override loader options", async () => { + const testId = "./basic.styl"; + const stylusOptions = { + compress: false, + resolveURL: { + nocheck: false, + }, + sourcemap: { + comment: true, + inline: true, + }, + }; + const compiler = getCompiler( + testId, + { stylusOptions }, + { mode: "production" } + ); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { stylusOptions }); + + expect(stylusOptions).toEqual({ + compress: false, + resolveURL: { + nocheck: false, + }, + sourcemap: { + comment: true, + inline: true, + }, + }); + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot("css"); + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); }); diff --git a/test/sourceMap-options.test.js b/test/sourceMap-options.test.js index 50b53b2..5b76a37 100644 --- a/test/sourceMap-options.test.js +++ b/test/sourceMap-options.test.js @@ -249,4 +249,23 @@ describe('"sourceMap" options', () => { expect(getWarnings(stats)).toMatchSnapshot("warnings"); expect(getErrors(stats)).toMatchSnapshot("errors"); }); + + it("should work and allow to override source maps options", async () => { + const testId = "./basic.styl"; + const stylusOptions = { + sourcemap: { + comment: true, + inline: true, + }, + }; + const compiler = getCompiler(testId, { stylusOptions }); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { stylusOptions }); + + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot("css"); + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); });