sdc-build-wp 2.7.1 → 3.0.1

package/README.md

@@ -8,4 +8,8 @@ sdc-build-wp --watch # build and watch
 
 ## Develop
 
-Develop locally with `node ~/sites/sdc/sdc-build-wp/index.js --watch` from within the test project directory.
+Develop locally with the following command from within the test project directory:
+
+```
+node ~/sites/sdc/sdc-build-wp/index.js --watch
+```

package/index.js

@@ -9,26 +9,29 @@ import glob from 'glob';
 import bustCache from './lib/bustCache.js';
 import buildSass from './lib/style.js';
 import buildJS from './lib/scripts.js';
-import buildBlocks from './lib/blocks.js';
+import buildBlock from './lib/blocks.js';
 import buildImages from './lib/images.js';
 import buildFonts from './lib/fonts.js';
 import buildBrowserSync from './lib/browsersync.js';
 
 let chokidarOpts = {
-	ignoreInitial: true
+	ignoreInitial: true,
+	ignored: [
+		project.path + '/blocks/*/build/**/*'
+	]
 };
 
 let sassGlobPath = project.package?.sdc?.sassGlobPath || project.path + '{/_src/style,/blocks}/**/*.scss';
 let sassGlob = glob.sync(sassGlobPath, {
 	ignore: [
-		project.path  + '/_src/style/partials/_theme.scss'
+		project.path + '/_src/style/partials/_theme.scss'
 	]
 });
 let jsGlobPath = project.package?.sdc?.jsGlobPath || project.path + '/_src/scripts/**/*.js';
 let jsGlob = glob.sync(jsGlobPath, {
 	ignore: []
 });
-let blockGlobPath = project.package?.sdc?.blockGlobPath || project.path + '/_src/blocks/**/*.{js,jsx}';
+let blockGlobPath = project.package?.sdc?.blockGlobPath || project.path + '/blocks/*';
 let blockGlob = glob.sync(blockGlobPath);
 
 function bustFunctionsCache() {
@@ -79,12 +82,17 @@ for (const [name, files] of Object.entries(entries)) {
 	});
 }
 
-buildBlocks(blockGlob);
-bustFunctionsCache();
+function runBlocks() {
+	for (var block of blockGlob) {
+		buildBlock(block);
+	}
+	bustFunctionsCache();
+}
+
+runBlocks();
 if (argv.watch) {
 	chokidar.watch(blockGlob, chokidarOpts).on('all', (event, path) => {
-		buildBlocks(blockGlob);
-		bustFunctionsCache();
+		runBlocks();
 	});
 }
 

package/lib/blocks.js

@@ -1,47 +1,50 @@
 import path from 'path';
 import project from '../lib/project.js';
 import log from './logging.js';
-import esbuild from 'esbuild';
-import { ESLint } from 'eslint';
-import { readFile } from 'fs/promises';
+import { stat } from 'fs/promises';
+import { spawn } from 'child_process';
+import process from 'process';
 
-const buildBlocks = async (entries) => {
-	let timerStart = Date.now();
-	try {
-		const eslint = new ESLint({
-			baseConfig: JSON.parse(await readFile(new URL('../.eslintrc', import.meta.url))),
-			fix: true
-		});
-		const lintresults = await eslint.lintFiles(entries);
-		await ESLint.outputFixes(lintresults);
-		const formatter = await eslint.loadFormatter('stylish');
-		const formatterOutput = formatter.format(lintresults);
-		if (formatterOutput) { console.log(formatterOutput.replace(project.path + '/_src/blocks/', '')); }
-	} catch (error) {
-		console.log(error);
-		log('error', `Failed linting ${entries.length} blocks - See above error.`);
-		return false;
-	}
-	try {
-		const result = await esbuild.build({
-			platform: 'node',
-			entryPoints: entries,
-			bundle: true,
-			loader: { '.js' : 'jsx' },
-			minify: true,
-			outdir: 'dist/blocks/',
-			entryNames: '[dir]/[name].min',
-			plugins: [],
-			sourcemap: true
-		});
-		if (result.warnings.length > 0) {
-			log('warn', result.warnings);
+function cmd(...command) {
+  let p = spawn(command[0], command.slice(1), {
+		shell: true
+	});
+  return new Promise((resolveFunc) => {
+    // p.stdout.on("data", (x) => {
+    //   process.stdout.write(x.toString());
+    // });
+    p.stderr.on('data', (x) => {
+      process.stderr.write(x.toString());
+			log('error', `Failed building blocks - See above error.`);
+    });
+    p.on('exit', (code) => {
+      resolveFunc(code);
+    });
+  });
+}
+
+const buildBlock = async (entry) => {
+	let workingBlockJson = null;
+	let potentialBlockJsonLocations = [
+		`${entry}/src/block.json`,
+		// `${entry}/block.json`
+	];
+	for (var location of potentialBlockJsonLocations) {
+		try {
+			await stat(location);
+			workingBlockJson = location
+			break;
+		} catch (error) {
+			//
 		}
-	} catch (error) {
-		log('error', `Failed building ${entries.length} blocks - See above error.`);
+	}
+	if (workingBlockJson === null) {
+		log('error', `Failed building ${entry} blocks - no block.json found.`);
 		return false;
 	}
-	log('success', `Built ${entries.length} blocks in ${Date.now() - timerStart}ms`);
+	let timerStart = Date.now();
+	await cmd(`cd ${entry} && ${project.path}/node_modules/@wordpress/scripts/bin/wp-scripts.js`, 'build');
+	log('success', `Built ${entry.replace(project.path, '')} in ${Date.now() - timerStart}ms`);
 };
 
-export default buildBlocks;
+export default buildBlock;

package/lib/style.js

@@ -3,7 +3,7 @@ import path from 'path';
 import { fileURLToPath } from 'url';
 import project from '../lib/project.js';
 import log from './logging.js';
-import sass from 'sass';
+import * as sass from 'sass';
 import postcss from 'postcss';
 import autoprefixer from 'autoprefixer';
 import sortMQ from 'postcss-sort-media-queries';
@@ -59,39 +59,43 @@ const buildSass = async (entry, name, entriesToLint) => {
 			log('error', `Failed linting ${entry.replace(project.path + '/_src/style/', '')} - See above error.`);
 			return false;
 		}
-		sass.render({
-			file: entry,
-			outFile: outFile,
-			outputStyle: 'compressed'
-		}, function(error, result) {
-			if (error) {
-				console.log(error.formatted);
-				log('error', `Failed building ${entryLabel} - See above error.`);
-				return false;
-			}
-			if (!fs.existsSync(project.path + '/dist')) {
-				fs.mkdirSync(project.path + '/dist');
-			}
-			if (!fs.existsSync(project.path + '/dist/style')) {
-				fs.mkdirSync(project.path + '/dist/style');
-			}
-			postcss([
-				autoprefixer(),
-				sortMQ()
-			]).process(result.css, { from: undefined }).then(resultPost => {
-				fs.writeFile(outFile, resultPost.css, function(err) {
-					if (err) {
-						console.log(err);
-						log('error', `Failed saving ${entryLabel} - See above error.`);
-						return false;
-					} else {
-						log('success', `Built ${entryLabel} in ${Date.now() - timerStart}ms`);
+		try {
+			const result = sass.compile(entry, {
+				style: 'compressed'
+			});
+			fs.writeFile(outFile, result.css, function(err) {
+				if (err) {
+					console.log(err);
+					log('error', `Failed building ${entryLabel} - See above error.`);
+					return false;
+				} else {
+					if (!fs.existsSync(project.path + '/dist')) {
+						fs.mkdirSync(project.path + '/dist');
 					}
-				});
+					if (!fs.existsSync(project.path + '/dist/style')) {
+						fs.mkdirSync(project.path + '/dist/style');
+					}
+					postcss([
+						autoprefixer(),
+						sortMQ()
+					]).process(result.css, { from: undefined }).then(resultPost => {
+						fs.writeFile(outFile, resultPost.css, function(err) {
+							if (err) {
+								console.log(err);
+								log('error', `Failed saving ${entryLabel} - See above error.`);
+								return false;
+							} else {
+								log('success', `Built ${entryLabel} in ${Date.now() - timerStart}ms`);
+							}
+						});
+					});
+				}
 			});
-		});
+		} catch {
+			log('error', `Failed building ${entryLabel} - See above error.`);
+				return false;
+		}
 	});
-
 };
 
 export default buildSass;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sdc-build-wp",
-  "version": "2.7.1",
+  "version": "3.0.1",
   "description": "Custom WordPress build process.",
   "author": {
     "name": "Robert Sefer",
@@ -19,6 +19,7 @@
     "sdc-build-wp": "./index.js"
   },
   "dependencies": {
+    "@wordpress/scripts": "^26.6.0",
     "autoprefixer": "^10.4.13",
     "browser-sync": "^2.27.11",
     "chalk": "^5.2.0",
@@ -35,7 +36,7 @@
     "postcss": "^8.4.20",
     "postcss-scss": "^4.0.6",
     "postcss-sort-media-queries": "^4.3.0",
-    "sass": "^1.57.1",
+    "sass": "^1.63.4",
     "stylelint": "^14.16.0"
   }
 }