diff --git a/build/postcss.config.mjs b/build/postcss.config.mjs index fb9ace77..a80123dd 100644 --- a/build/postcss.config.mjs +++ b/build/postcss.config.mjs @@ -1,59 +1,25 @@ import fs from "fs"; import path from "path"; -import postcss from "postcss"; +import postcssImport from "postcss-import"; import postcssMixins from "postcss-mixins"; import stylelint from "stylelint"; import postcssLightningcss from "postcss-lightningcss"; import reporter from "postcss-reporter"; -import { bundleAsync } from "lightningcss"; - -const lightningcssBundle = (opts = {}) => { - return { - postcssPlugin: "lightningcss-bundle", - async Once(root, { result }) { - const filename = opts.filename || result.opts.from; - const tempRoot = postcss.root(); - - try { - const { code } = await bundleAsync({ - filename, - ...opts.lightningcssOptions, - resolver: { - read(filePath) { - if (filePath.startsWith('http')) { - return ''; - } - return fs.readFileSync(filePath, 'utf8'); - }, - resolve(specifier, from) { - if (specifier.startsWith('http')) { - return from; - } - const resolvedPath = path.resolve(path.dirname(from), specifier); - const content = fs.readFileSync(resolvedPath, 'utf8'); - tempRoot.append(postcss.parse(content)); - return resolvedPath; - } - } - }); - - root.removeAll(); - root.append(tempRoot); - root.append(postcss.parse(code)); - } catch (error) { - console.error("LightningCSS bundling error:", error); - throw error; - } - } - }; -}; +import browserslist from "browserslist"; +import { browserslistToTargets } from "lightningcss"; export default (ctx) => { const nodeEnv = ctx.env; const dev = nodeEnv === "development"; - const browserslistpath = path.resolve(ctx.file.dirname, "../../.browserslistrc"); - const browserslist = fs.readFileSync(browserslistpath, "utf8").trim(); + const browserslistpath = path.resolve( + ctx.file.dirname, + "../../.browserslistrc" + ); + const browserslistText = fs.readFileSync(browserslistpath, "utf8").trim(); + const browserTargets = browserslistToTargets( + browserslist(browserslistText) + ); const stylelintOptions = { configFile: path.join(ctx.cwd, "/.stylelintrc"), @@ -64,16 +30,14 @@ export default (ctx) => { mixinsDir: path.join(ctx.file.dirname, "/parts") }; - lightningcssBundle.postcss = true; - const lightningcssOptions = { - browsers: browserslist, + browsers: browserslistText, lightningcssOptions: { minify: !dev, sourceMap: true, cssModules: false, + targets: browserTargets, drafts: { - nesting: true, customMedia: true }, visitor: { @@ -92,9 +56,8 @@ export default (ctx) => { }; const reporterOptions = { - formatter: input => { - return input.source + " produced " + input.messages.length + " messages \n"; - }, + formatter: (input) => + `${input.source} produced ${input.messages.length} messages \n`, clearMessages: true }; @@ -104,8 +67,8 @@ export default (ctx) => { case "production": case "development": plugins = [ + postcssImport(), // Add postcss-import at the beginning stylelint(stylelintOptions), - lightningcssBundle(lightningcssOptions), postcssMixins(mixinOptions), postcssLightningcss(lightningcssOptions), reporter(reporterOptions) diff --git a/bun.lockb b/bun.lockb index e6beb350..13c10c80 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/package.json b/package.json index e344ab38..9ef2c740 100644 --- a/package.json +++ b/package.json @@ -1,40 +1,41 @@ { - "name": "black-highlighter", - "description": "Modern base theme for the SCP Wiki (build process)", - "version": "1.0.0", - "authors": "Woedenaz, Croquembouche", - "license": "CC-BY-SA-3.0", - "repository": { - "type": "git", - "url": "https://github.com/Nu-SCPTheme/Black-Highlighter" - }, - "engines": { - "bun": ">=1.0.17" - }, - "devDependencies": { - "@csstools/postcss-global-data": "^3.0.0", - "autoprefixer": "^10.4.20", - "caniuse-lite": "^1.0.30001651", - "cross-env": "^7.0.3", - "eslint": "^9.9.0", - "eslint-config-prettier": "^9.1.0", - "eslint-plugin-prettier": "^5.2.1", - "lightningcss": "^1.26.0", - "postcss": "^8.4.41", - "postcss-cli": "^11.0.0", - "postcss-csso": "^6.0.1", - "postcss-lightningcss": "^1.0.1", - "postcss-mixins": "^11.0.0", - "postcss-reporter": "^7.1.0", - "prettier": "^3.3.3", - "stylelint": "^16.8.2", - "stylelint-config-property-sort-order-smacss": "^10.0.0", - "stylelint-config-standard": "^36.0.1", - "svgo": "^3.3.2" - }, - "scripts": { - "build": "make", - "base": "cross-env postcss $bhl_i --config build/postcss.config.mjs -o $bhl_o -w --env $bhl_env --verbose", - "watch": "cross-env bhl_i=src/css/black-highlighter.css bhl_o=dist/css/black-highlighter.css bhl_env=development bun base & cross-env bhl_i=src/css/black-highlighter.css bhl_o=dist/css/min/black-highlighter.min.css bhl_env=production bun base & cross-env bhl_i=src/css/normalize.css bhl_o=dist/css/min/normalize.min.css bhl_env=development bun base" - } + "name": "black-highlighter", + "description": "Modern base theme for the SCP Wiki (build process)", + "version": "1.0.0", + "authors": "Woedenaz, Croquembouche", + "license": "CC-BY-SA-3.0", + "repository": { + "type": "git", + "url": "https://github.com/Nu-SCPTheme/Black-Highlighter" + }, + "engines": { + "bun": ">=1.0.17" + }, + "devDependencies": { + "@csstools/postcss-global-data": "^3.0.0", + "autoprefixer": "^10.4.20", + "caniuse-lite": "^1.0.30001651", + "cross-env": "^7.0.3", + "eslint": "^9.9.0", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-prettier": "^5.2.1", + "lightningcss": "^1.26.0", + "postcss": "^8.4.41", + "postcss-cli": "^11.0.0", + "postcss-csso": "^6.0.1", + "postcss-import": "^16.1.0", + "postcss-lightningcss": "^1.0.1", + "postcss-mixins": "^11.0.0", + "postcss-reporter": "^7.1.0", + "prettier": "^3.3.3", + "stylelint": "^16.8.2", + "stylelint-config-property-sort-order-smacss": "^10.0.0", + "stylelint-config-standard": "^36.0.1", + "svgo": "^3.3.2" + }, + "scripts": { + "build": "make", + "base": "cross-env postcss $bhl_i --config build/postcss.config.mjs -o $bhl_o -w --env $bhl_env --verbose", + "watch": "cross-env bhl_i=src/css/black-highlighter.css bhl_o=dist/css/black-highlighter.css bhl_env=development bun base & cross-env bhl_i=src/css/black-highlighter.css bhl_o=dist/css/min/black-highlighter.min.css bhl_env=production bun base & cross-env bhl_i=src/css/normalize.css bhl_o=dist/css/min/normalize.min.css bhl_env=development bun base" + } }