@tmbr/bundler 1.6.2 → 1.8.1

package/cli.js

@@ -4,11 +4,12 @@ const fs = require('fs');
 const path = require('path');
 const exec = require('child_process').execSync;
 const chalk = require('chalk');
-const styles = require('esbuild-sass-plugin').sassPlugin;
-const qrcode = require('qrcode-terminal');
 const server = require('browser-sync').create();
+const styles = require('esbuild-sass-plugin').sassPlugin;
+const silent = require('sass').Logger.silent;
 
 const dir = process.cwd();
+const src = path.resolve(dir, 'src');
 const package = require(`${dir}/package.json`);
 const command = process.argv[2];
 
@@ -17,89 +18,98 @@ if (!['build', 'watch'].includes(command)) {
   process.exit();
 }
 
-exec(`rm -rf ${dir}/build/*`);
+const logger = (options = {}) => ({
+  name: 'logger',
+  setup(context) {
 
-function ok() {
-  const host = server.getOption('proxy').get('target');
-  const port = server.getOption('port');
-  const proxying = `${host}:${port}`;
-  const external = server.getOption('urls').get('external');
+    // let reset = true;
+    // const path = `${context.initialOptions.outdir}/${Object.keys(context.initialOptions.entryPoints)[0]}`;
 
-  console.clear();
-  external && qrcode.generate(external, {small: true}, console.log);
-  console.log(`Proxying: ${chalk.green(proxying)}`);
-  console.log(`External: ${chalk.cyan(external || 'offline')}\n`);
-}
-
-function entryPoints(suffix = '') {
-
-  if (!suffix.startsWith('.')) {
-    suffix = `.${suffix}`;
-  }
-
-  const entries = Object.entries({
-    admin: path.resolve(dir, './src/admin'),
-    main: path.resolve(dir, './src'),
-  });
-
-  return entries.reduce((result, [name, path]) => {
-    if (fs.existsSync(path)) result[`${name}${suffix}`] = path;
-    return result;
-  }, {});
-}
+    context.onStart(() => {
+      server.instance.active && server.info();
+    });
 
-const errors = (options = {}) => ({
-  name: 'errors',
-  setup(build) {
-    build.onEnd(({warnings, errors}) => {
-      (warnings.length || errors.length) ? console.log('\007') : ok();
+    context.onEnd(result => {
+      if (result.warnings.length || result.errors.length) return console.log('\007');
+      // console.log(`${path}.css`);
+      // console.log(`${path}.js`);
+      // const stats = fs.statSync('main.min.js');
+      // const bytes = stats.size;
+      // console.log(`build/main.min.js ${bytes / 1000}`);
+      // console.log(`build/main.min.css ${Math.round(fs.statSync('build/main.min.css').size / 1000)} KB`);
+      // console.log(`build ended with ${result.errors.length} errors`);
+      // build/main.min.css 47KB
+      // build/main.min.js  170KB
     });
-  },
+  }
 });
 
-const defaults = {
-  watch: command === 'watch',
-  alias: {'~': path.resolve(dir, 'src')},
-  outdir: path.resolve(dir, 'build'),
+const buildOptions = {
+  entryPoints: {'main.min': src},
+  alias: {'~': src},
+  outdir: 'build',
   bundle: true,
   minify: true,
   target: 'es2019',
-  external: 'jpg,jpeg,webp,png,svg,woff,woff2'.split(',').map(ext => `*.${ext}`),
+  external: 'jpg,jpeg,webp,png,gif,svg,woff,woff2'.split(',').map(ext => `*.${ext}`),
   logLevel: 'warning',
   sourcemap: false,
   treeShaking: true,
   legalComments: 'none',
-  plugins: [styles({sourceMap: true})],
+  plugins: [
+    styles({sourceMap: false, logger: silent}),
+    logger()
+  ]
 };
 
-const watchConfig = Object.assign({}, defaults, {
-  entryPoints: entryPoints('dev'),
+const watchOptions = Object.assign({}, buildOptions, {
+  entryPoints: {'main.dev': src},
   minify: false,
-  sourcemap: 'inline',
   logLevel: 'silent',
-  plugins: [...defaults.plugins, errors()],
+  sourcemap: 'inline',
+  plugins: [
+    styles({sourceMap: true})
+  ]
 });
 
-const buildConfig = Object.assign({}, defaults, {
-  entryPoints: entryPoints('min'),
-});
+const serveOptions = {
+  proxy: `${package.name}.test`,
+  files: ['assets/**', 'build/*', '**/*.php'],
+  host: 'localhost',
+  open: false,
+  notify: false,
+  logLevel: 'silent',
+  injectChanges: false,
+  ui: false,
+};
+
+server.info = function() {
+  const host = server.getOption('proxy').get('target');
+  const port = server.getOption('port');
+  const proxying = `${host}:${port}`;
+  const external = server.getOption('urls').get('external');
 
-const noop = fn => fn;
-esbuild.build(watchConfig).catch(noop);
-esbuild.build(buildConfig).catch(noop);
+  console.clear();
+  console.log();
+  console.log(`Proxying: ${chalk.green(proxying)}`);
+  console.log(`External: ${chalk.cyan(external || 'offline')}\n`);
+};
 
-if (command === 'watch') {
+async function main() {
 
-  const options = {
-    proxy: `${package.name}.test`,
-    files: ['assets/**', 'build/*', '**/*.php'],
-    injectChanges: false,
-    host: 'localhost',
-    open: false,
-    notify: false,
-    logLevel: 'silent',
-    ui: false,
-  };
+  const watcher = await esbuild.context(watchOptions);
+  const builder = await esbuild.context(buildOptions);
 
-  server.init(options, ok);
+  if (command === 'build') {
+    await watcher.rebuild();
+    await builder.rebuild();
+    process.exit();
+  }
+
+  server.init(serveOptions, () => {
+    builder.watch();
+    watcher.watch();
+  });
 }
+
+main();

package/package.json

@@ -1,18 +1,15 @@
 {
   "name": "@tmbr/bundler",
-  "author": "TMBR (https://wearetmbr.com/)",
-  "version": "1.6.2",
-  "license": "MIT",
-  "repository": "https://github.com/TMBR/tmbr-bundler",
-  "description": "WordPress development toolkit built on esbuild and browser-sync",
+  "version": "1.8.1",
+  "repository": "github:TMBR/tmbr-bundler",
   "bin": {
+    "bundler": "cli.js",
     "tmbr-bundler": "cli.js"
   },
   "dependencies": {
-    "browser-sync": "^2.27.10",
+    "browser-sync": "^2.28.3",
     "chalk": "^4.1.2",
-    "esbuild": "^0.16.10",
-    "esbuild-sass-plugin": "^2.3.2",
-    "qrcode-terminal": "^0.12.0"
+    "esbuild": "^0.17.11",
+    "esbuild-sass-plugin": "^2.6.0"
   }
 }