Craft WordPress theme configurations using the full power of TypeScript: split configs, leverage functions, iterate over arrays, and even throw in some comments.
import { config, settings, styles } from "@wp-dx/theme-config";
async function creatThemeJson() {
const themeJson = config.create(
config.withVersion(2),
config.withSchema("https://schemas.wp.org/wp/6.5/theme.json"),
config.withSettings(
settings.create(
settings.withAppearanceTools(true),
settings.withSpacing({ padding: true, margin: true }),
settings.withTypography({ customFontSize: true, fontWeight: true }),
),
),
config.withStyles(styles.create(
styles.withElement("button", {
color: { text: "#ffffff", background: "#000000" },
":hover": { color: { text: "#000000", background: "#fff47b" } },
}, true),
)),
);
// Deno (assuming write permission to the current directory)
async function writeThemeJsonDeno() {
try {
await Deno.writeTextFile(
"theme.json",
JSON.stringify(themeJson, null, 2), // see above snippet for themeJson implementation
);
console.log("✓ theme.json updated");
} catch (error) {
console.error("Failed to write theme.json:", error);
}
}
if (import.meta.main) {
await writeThemeJsonDeno();
}
const { createThemeJson } = require('./src/theme-generator');
const fs = require('fs');
function writeThemeJsonNode() {
const themeJson = createThemeJson();
try {
fs.writeFileSync("theme.json", JSON.stringify(themeJson, null, 2)); // see above snippet for themeJson implementation
console.log("✓ theme.json updated");
} catch (error) {
console.error("Failed to write theme.json:", error);
}
}
writeThemeJsonNode();
import { createThemeJson } from './src/theme-generator';
async function writeThemeJsonBun() {
const themeJson = createThemeJson();
try {
await Bun.file("theme.json").write(JSON.stringify(themeJson, null, 2)); // see above snippet for themeJson implementation
console.log("✓ theme.json updated");
} catch (error) {
console.error("Failed to write theme.json:", error);
}
}
await writeThemeJsonBun();
To install the library:
deno add jsr:@wp-dx/theme-config
npm install @wp-dx/theme-config
The examples
directory contains example projects demonstrating usage in different environments:
- basic.ts: A basic usage example demonstrating theme configuration creation.
- bun: A Bun project showcasing theme configuration usage with Bun-specific considerations.
- nodejs: A Node.js project demonstrating theme configuration usage with Node.js-specific considerations.
Contributions to this project are welcome! Please see the CONTRIBUTING.md file for details on how to submit pull requests and code contributions.
Inspired by the article How to Split Theme.json into Multiple Files with WordPress.