diff --git a/lib/plugins/postcss-extract-media-query.js b/lib/plugins/postcss-extract-media-query.js index 25381b9..dbc7346 100644 --- a/lib/plugins/postcss-extract-media-query.js +++ b/lib/plugins/postcss-extract-media-query.js @@ -4,7 +4,7 @@ const fs = require('fs'); const path = require('path'); const postcss = require('postcss'); -const minify = require('postcss-csso'); +const minify = require('@csstools/postcss-minify'); const toKebabCase = (str) => str.toLowerCase().replace(/\s+/g, '-'); diff --git a/lib/postcss-plugins.js b/lib/postcss-plugins.js index 505b7e7..a0214cd 100644 --- a/lib/postcss-plugins.js +++ b/lib/postcss-plugins.js @@ -53,7 +53,7 @@ exports.defaultPlugins = ({ ...(bundle ? [ require('@fullhuman/postcss-purgecss')(purgeCssOpts), - require('postcss-csso'), + require('@csstools/postcss-minify'), ] : []), ]; diff --git a/package-lock.json b/package-lock.json index 82a6aa8..be1a4a4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,9 +10,9 @@ "license": "UNLICENSED", "dependencies": { "@fullhuman/postcss-purgecss": "^6", + "@csstools/postcss-minify": "^2", "autoprefixer": "^10", "postcss-color-function": "^4", - "postcss-csso": "lookback/postcss-csso#fix/csso-container-queries", "postcss-import": "^16", "postcss-nested": "^6", "tailwindcss": "=2.0.2" @@ -29,6 +29,48 @@ "postcss": "^8" } }, + "node_modules/@csstools/css-tokenizer": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.1.tgz", + "integrity": "sha512-UBqaiu7kU0lfvaP982/o3khfXccVlHPWp0/vwwiIgDF0GmqqqxoiXC/6FCjlS9u92f7CoEz6nXKQnrn1kIAkOw==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@csstools/postcss-minify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@csstools/postcss-minify/-/postcss-minify-2.0.1.tgz", + "integrity": "sha512-LcVHjHhI0DjMRzW73EHxICIgp1JNQV7H2ucTRZzxWOdWP+ODRz+bzcwo2HdtG7jvqMYKSpkxXhikhnYGFWMUxg==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "dependencies": { + "@csstools/css-tokenizer": "^3.0.1" + }, + "engines": { + "node": ">=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, "node_modules/@fullhuman/postcss-purgecss": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-6.0.0.tgz", @@ -789,36 +831,11 @@ "ms": "^2.1.1" } }, - "node_modules/css-tree": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz", - "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==", - "dependencies": { - "mdn-data": "2.0.28", - "source-map-js": "^1.0.1" - }, - "engines": { - "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0", - "npm": ">=7.0.0" - } - }, "node_modules/css-unit-converter": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/css-unit-converter/-/css-unit-converter-1.1.2.tgz", "integrity": "sha512-IiJwMC8rdZE0+xiEZHeru6YoONC4rfPMqGm2W85jMIbkFvv5nFTwJVFHam2eFrN6txmoUYFAFXiv8ICVeTO0MA==" }, - "node_modules/csso": { - "version": "5.0.5", - "resolved": "https://registry.npmjs.org/csso/-/csso-5.0.5.tgz", - "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==", - "dependencies": { - "css-tree": "~2.2.0" - }, - "engines": { - "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0", - "npm": ">=7.0.0" - } - }, "node_modules/debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -1585,11 +1602,6 @@ "node": ">=10" } }, - "node_modules/mdn-data": { - "version": "2.0.28", - "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz", - "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==" - }, "node_modules/merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", @@ -2232,21 +2244,6 @@ "node": ">=4" } }, - "node_modules/postcss-csso": { - "version": "6.0.1", - "resolved": "git+ssh://git@github.com/lookback/postcss-csso.git#6cb7497ebb1c3788e2304267ac30b244f7809947", - "license": "MIT", - "dependencies": { - "csso": "^5.0.5" - }, - "engines": { - "node": "^12.20.0 || ^14.13.0 || >=15.0.0", - "npm": ">=7.0.0" - }, - "peerDependencies": { - "postcss": "^8.0.0" - } - }, "node_modules/postcss-functions": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-functions/-/postcss-functions-3.0.0.tgz", @@ -3525,6 +3522,19 @@ } }, "dependencies": { + "@csstools/css-tokenizer": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.1.tgz", + "integrity": "sha512-UBqaiu7kU0lfvaP982/o3khfXccVlHPWp0/vwwiIgDF0GmqqqxoiXC/6FCjlS9u92f7CoEz6nXKQnrn1kIAkOw==" + }, + "@csstools/postcss-minify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@csstools/postcss-minify/-/postcss-minify-2.0.1.tgz", + "integrity": "sha512-LcVHjHhI0DjMRzW73EHxICIgp1JNQV7H2ucTRZzxWOdWP+ODRz+bzcwo2HdtG7jvqMYKSpkxXhikhnYGFWMUxg==", + "requires": { + "@csstools/css-tokenizer": "^3.0.1" + } + }, "@fullhuman/postcss-purgecss": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-6.0.0.tgz", @@ -4064,28 +4074,11 @@ } } }, - "css-tree": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz", - "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==", - "requires": { - "mdn-data": "2.0.28", - "source-map-js": "^1.0.1" - } - }, "css-unit-converter": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/css-unit-converter/-/css-unit-converter-1.1.2.tgz", "integrity": "sha512-IiJwMC8rdZE0+xiEZHeru6YoONC4rfPMqGm2W85jMIbkFvv5nFTwJVFHam2eFrN6txmoUYFAFXiv8ICVeTO0MA==" }, - "csso": { - "version": "5.0.5", - "resolved": "https://registry.npmjs.org/csso/-/csso-5.0.5.tgz", - "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==", - "requires": { - "css-tree": "~2.2.0" - } - }, "debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -4643,11 +4636,6 @@ "yallist": "^4.0.0" } }, - "mdn-data": { - "version": "2.0.28", - "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz", - "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==" - }, "merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", @@ -5088,13 +5076,6 @@ } } }, - "postcss-csso": { - "version": "git+ssh://git@github.com/lookback/postcss-csso.git#6cb7497ebb1c3788e2304267ac30b244f7809947", - "from": "postcss-csso@lookback/postcss-csso#fix/csso-container-queries", - "requires": { - "csso": "^5.0.5" - } - }, "postcss-functions": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-functions/-/postcss-functions-3.0.0.tgz", diff --git a/package.json b/package.json index b8f0dfe..cef1b3c 100644 --- a/package.json +++ b/package.json @@ -50,10 +50,10 @@ "postcss": "^8" }, "dependencies": { + "@csstools/postcss-minify": "^2", "@fullhuman/postcss-purgecss": "^6", "autoprefixer": "^10", "postcss-color-function": "^4", - "postcss-csso": "lookback/postcss-csso#fix/csso-container-queries", "postcss-import": "^16", "postcss-nested": "^6", "tailwindcss": "=2.0.2" diff --git a/postcss.config.js b/postcss.config.js index ef9ac1c..57f4ff8 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -3,7 +3,7 @@ const { defaultPlugins } = require('./lib/postcss-plugins'); const path = require('path'); const extractMediaQuery = require('./lib/plugins/postcss-extract-media-query'); const header = require('./lib/plugins/postcss-header'); -const csso = require('postcss-csso'); +const minify = require('@csstools/postcss-minify'); const extractDarkModeQueries = (dest, prod = false) => extractMediaQuery({ @@ -32,6 +32,6 @@ module.exports = (ctx) => ({ header({ header: `/*! ${ctx.file.basename} v${version} ${new Date().toISOString()} */`, }), - ...(ctx.env === 'production' ? [csso] : []), + ...(ctx.env === 'production' ? [minify] : []), ], });