1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-11-14 10:57:41 +01:00

Switched to LightningCSS, still errors

This commit is contained in:
squidfunk 2024-09-09 10:16:50 +02:00
parent 8df393d111
commit ce745e91cd
No known key found for this signature in database
GPG Key ID: 5ED40BC4F9C436DF
3 changed files with 365 additions and 1233 deletions

1560
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -69,7 +69,6 @@
"@typescript-eslint/parser": "^8.4.0", "@typescript-eslint/parser": "^8.4.0",
"autoprefixer": "^10.4.20", "autoprefixer": "^10.4.20",
"chokidar": "^3.6.0", "chokidar": "^3.6.0",
"cssnano": "5.1.0",
"esbuild": "^0.23.1", "esbuild": "^0.23.1",
"eslint": "8.57.0", "eslint": "8.57.0",
"eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-eslint-comments": "^3.2.0",
@ -80,6 +79,7 @@
"gitlab": "^14.2.2", "gitlab": "^14.2.2",
"google-fonts-complete": "jonathantneal/google-fonts-complete", "google-fonts-complete": "jonathantneal/google-fonts-complete",
"html-minifier-terser": "^7.2.0", "html-minifier-terser": "^7.2.0",
"lightningcss": "^1.26.0",
"material-design-color": "^2.3.2", "material-design-color": "^2.3.2",
"material-shadows": "^3.0.1", "material-shadows": "^3.0.1",
"npm-check-updates": "^17.1.1", "npm-check-updates": "^17.1.1",

View File

@ -20,9 +20,10 @@
* IN THE SOFTWARE. * IN THE SOFTWARE.
*/ */
import { createHash } from "crypto" import { BinaryLike, createHash } from "crypto"
import { build as esbuild } from "esbuild" import { build as esbuild } from "esbuild"
import * as fs from "fs/promises" import * as fs from "fs/promises"
import { transform } from "lightningcss"
import * as path from "path" import * as path from "path"
import postcss from "postcss" import postcss from "postcss"
import { import {
@ -74,7 +75,7 @@ const root = new RegExp(`file://${path.resolve(".")}/`, "g")
* *
* @returns File with digest * @returns File with digest
*/ */
function digest(file: string, data: string): string { function digest(file: string, data: BinaryLike | string): string {
if (process.argv.includes("--optimize")) { if (process.argv.includes("--optimize")) {
const hash = createHash("sha256").update(data).digest("hex") const hash = createHash("sha256").update(data).digest("hex")
return file.replace(/\b(?=\.)/, `.${hash.slice(0, 8)}.min`) return file.replace(/\b(?=\.)/, `.${hash.slice(0, 8)}.min`)
@ -117,10 +118,7 @@ export function transformStyle(
`${base}/templates/.icons` `${base}/templates/.icons`
], ],
encode: false encode: false
}), })
...process.argv.includes("--optimize")
? [require("cssnano")]
: []
]) ])
.process(css, { .process(css, {
from: options.from, from: options.from,
@ -135,13 +133,20 @@ export function transformStyle(
console.log(err.formatted || err.message) console.log(err.formatted || err.message)
return EMPTY return EMPTY
}), }),
switchMap(({ css, map }) => { switchMap(({ css, map }) => of(transform({
const file = digest(options.to, css) code: Buffer.from(css),
filename: options.from,
minify: true,
sourceMap: false,
inputSourceMap: map.toString()
}))),
switchMap(({ code, map }) => {
const file = digest(options.to, code)
return concat( return concat(
mkdir(path.dirname(file)), mkdir(path.dirname(file)),
merge( merge(
write(`${file}.map`, `${map}`.replace(root, "")), write(`${file}.map`, `${map}`.replace(root, "")),
write(`${file}`, css.replace( write(`${file}`, code.toString().replace(
options.from, options.from,
path.basename(file) path.basename(file)
)), )),
@ -180,15 +185,16 @@ export function transformScript(
name: "mkdocs-material/inline", name: "mkdocs-material/inline",
setup(build) { setup(build) {
build.onLoad({ filter: /\.css/ }, async args => { build.onLoad({ filter: /\.css/ }, async args => {
const content = await fs.readFile(args.path, "utf8") const { code } = transform({
const { css } = await postcss([require("cssnano")]) code: await fs.readFile(args.path),
.process(content, { filename: args.path,
from: undefined minify: true,
sourceMap: false
}) })
/* Return minified CSS */ /* Return minified CSS */
return { return {
contents: css, contents: code,
loader: "text" loader: "text"
} }
}) })