diff --git a/README.md b/README.md index 3aa17d3..58129fe 100644 --- a/README.md +++ b/README.md @@ -164,6 +164,17 @@ module.exports = { * @default false */ hoistAtrules: true, + + /** + * Compress CSS output. + * In the "production" mode is `true` by default + * + * @see https://stylus-lang.com/docs/executable.html + * + * @type {boolean} + * @default false + */ + compress: true, }, }, }, diff --git a/src/utils.js b/src/utils.js index ae938fb..ecc3390 100644 --- a/src/utils.js +++ b/src/utils.js @@ -7,6 +7,10 @@ import { urlToRequest } from 'loader-utils'; import { klona } from 'klona/full'; import fastGlob from 'fast-glob'; +function isProductionLikeMode(loaderContext) { + return loaderContext.mode === 'production' || !loaderContext.mode; +} + function getStylusOptions(loaderContext, loaderOptions) { const stylusOptions = klona( typeof loaderOptions.stylusOptions === 'function' @@ -29,6 +33,10 @@ function getStylusOptions(loaderContext, loaderOptions) { ? stylusOptions.resolveURL : { nocheck: true }; + if (!stylusOptions.compress && isProductionLikeMode(loaderContext)) { + stylusOptions.compress = true; + } + return stylusOptions; } diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index e8bf28b..5d7542d 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -619,6 +619,12 @@ exports[`loader should use .json file: errors 1`] = `Array []`; exports[`loader should use .json file: warnings 1`] = `Array []`; +exports[`loader should work "compress" option: css 1`] = `"body{font:12px Helvetica,Arial,sans-serif}a.button{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}"`; + +exports[`loader should work "compress" option: errors 1`] = `Array []`; + +exports[`loader should work "compress" option: warnings 1`] = `Array []`; + exports[`loader should work "define" option with raw: css 1`] = ` "section.current-stylus-support { raw: \\"hash property access must use brackets\\"; @@ -757,6 +763,12 @@ exports[`loader should work binop import: errors 1`] = `Array []`; exports[`loader should work binop import: warnings 1`] = `Array []`; +exports[`loader should work compress in "production" mode: css 1`] = `"body{font:12px Helvetica,Arial,sans-serif}a.button{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}"`; + +exports[`loader should work compress in "production" mode: errors 1`] = `Array []`; + +exports[`loader should work compress in "production" mode: warnings 1`] = `Array []`; + exports[`loader should work indented import: css 1`] = ` "body { color: #f00; diff --git a/test/loader.test.js b/test/loader.test.js index 7530e8e..e88072b 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -1,3 +1,7 @@ +/** + * @jest-environment node + */ + import fs from 'fs'; import path from 'path'; @@ -1005,7 +1009,7 @@ describe('loader', () => { const compiler = getCompiler(testId); const stats = await compile(compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); @@ -1307,6 +1311,44 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); + it('should work "compress" option', async () => { + const testId = './basic.styl'; + const compiler = getCompiler(testId, { + stylusOptions: { + compress: true, + }, + }); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { + stylusOptions: { + compress: true, + }, + }); + + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot('css'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it('should work compress in "production" mode', async () => { + const testId = './basic.styl'; + const compiler = getCompiler(testId, {}, { mode: 'production' }); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { + stylusOptions: { + compress: true, + }, + }); + + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot('css'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + it('should use .json file', async () => { const testId = './json/index.styl'; const compiler = getCompiler(testId, { @@ -1343,7 +1385,7 @@ describe('loader', () => { expect(fileDependencies.has(fixture)).toBe(true); }); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); @@ -1366,7 +1408,7 @@ describe('loader', () => { const compiler = getCompiler(testId); const stats = await compile(compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect( getErrors(stats).map((item) => @@ -1386,7 +1428,7 @@ describe('loader', () => { const compiler = getCompiler(testId); const stats = await compile(compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); @@ -1396,7 +1438,7 @@ describe('loader', () => { const compiler = getCompiler(testId); const stats = await compile(compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); @@ -1407,7 +1449,7 @@ describe('loader', () => { const stats = await compile(compiler); const codeFromBundle = getCodeFromBundle(stats, compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(codeFromBundle.css).toMatchSnapshot('css'); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); @@ -1418,7 +1460,7 @@ describe('loader', () => { const compiler = getCompiler(testId); const stats = await compile(compiler); - expect(getCodeFromStylus(testId)).rejects.toThrow(); + await expect(getCodeFromStylus(testId)).rejects.toThrow(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); });