quickbundle 0.2.2 → 0.5.0

package/README.md

@@ -1,6 +1,66 @@
+<br>
 <div align="center">
     <h1>📦 Quickbundle</h1>
     <strong>The zero-configuration bundler powered by ESBuild</strong>
 </div>
+<br>
+<br>
 
-TODO
+## ✨ Features
+
+Quickbundle allows you to bundle a library with ease:
+
+-   Fast build thanks to [ESBuild bundler](https://github.com/evanw/esbuild)
+-   `package.json` as a first-class citizen to define your project build configurations
+-   `CJS` & `ESM` output format support
+-   Browser & Node.JS platform target support
+-   Peer dependencies support (excluded automatically from the build output)
+-   Quick development build support with a watch mode
+-   Production build support with optimized output
+-   TypeScript support
+-   JSX support
+
+<br>
+
+## 🚀 Quickstart
+
+1️⃣ Install by running:
+
+```bash
+# NPM
+npm install quickbundles
+# Yarn
+yarn add quickbundles
+```
+
+2️⃣ Set up your package configuration (`package.json`):
+
+```jsonc
+{
+	"name": "lib", // Package name
+	"source": "src/index.ts", // Source code entrypoint
+	"main": "./dist/lib.cjs", // CommonJS bundle output
+	"module": "./dist/lib.cjs.js", // ESM bundle output
+	"types": "./dist/lib.d.ts", // Typing output (not yet supported: coming soon...)
+	"platform": "node", // Platform target (optional, by default "browser")
+	"scripts": {
+		"prod": "quickbundle build", // Production mode (optimized bundles)
+		"dev": "microbundle watch" // Development mode (watch mode on each file change)
+	}
+}
+```
+
+3️⃣ Try it by running:
+
+```bash
+# NPM
+npm run prod
+# Yarn
+yarn prod
+```
+
+<br>
+
+## 🤩 Used by
+
+Contribution welcomed! 🤗

package/bin/bundler/bundler.d.ts

@@ -0,0 +1,9 @@
+import { ModuleFormat } from "../types";
+import { Metadata } from "./metadata";
+declare type BundlerOptions = {
+    isProduction: boolean;
+    isWatchMode: boolean;
+    onWatch: (error: Error | null) => void;
+};
+export declare const createBundler: (metadata: Metadata, { isProduction, isWatchMode, onWatch, }: Partial<BundlerOptions>) => Promise<(format: ModuleFormat) => Promise<string>>;
+export {};

package/bin/bundler/bundler.js

@@ -0,0 +1,49 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createBundler = void 0;
+const esbuild_1 = require("esbuild");
+const constants_1 = require("../constants");
+const plugins_1 = require("./plugins");
+const typescript_1 = require("./typescript");
+const createBundler = (metadata, { isProduction = false, isWatchMode = false, onWatch, }) => __awaiter(void 0, void 0, void 0, function* () {
+    const tsOptions = yield (0, typescript_1.getTypeScriptOptions)();
+    return (format) => __awaiter(void 0, void 0, void 0, function* () {
+        const outfile = metadata.destination[format];
+        if (!outfile) {
+            return Promise.reject("Unknown `destination` for the given `format`");
+        }
+        yield (0, esbuild_1.build)({
+            absWorkingDir: constants_1.CWD,
+            bundle: Boolean(metadata.externalDependencies),
+            define: {
+                "process.env.NODE_ENV": isProduction
+                    ? '"production"'
+                    : '"development"',
+            },
+            entryPoints: [metadata.source],
+            external: metadata.externalDependencies,
+            format,
+            metafile: true,
+            minify: isProduction,
+            outfile,
+            plugins: [(0, plugins_1.jsxPlugin)(metadata.allDependencies, tsOptions)],
+            platform: metadata.platform,
+            sourcemap: true,
+            target: (tsOptions === null || tsOptions === void 0 ? void 0 : tsOptions.target) || "esnext",
+            watch: isWatchMode && {
+                onRebuild: onWatch,
+            },
+        });
+        return outfile;
+    });
+});
+exports.createBundler = createBundler;

package/bin/bundler/index.d.ts

@@ -0,0 +1,3 @@
+export { createBundler } from "./bundler";
+export { getMetadata } from "./metadata";
+export type { Metadata } from "./metadata";

package/bin/bundler/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getMetadata = exports.createBundler = void 0;
+var bundler_1 = require("./bundler");
+Object.defineProperty(exports, "createBundler", { enumerable: true, get: function () { return bundler_1.createBundler; } });
+var metadata_1 = require("./metadata");
+Object.defineProperty(exports, "getMetadata", { enumerable: true, get: function () { return metadata_1.getMetadata; } });

package/bin/bundler/metadata.d.ts

@@ -0,0 +1,11 @@
+export declare type Metadata = ReturnType<typeof getMetadata>;
+export declare const getMetadata: () => {
+    readonly source: string;
+    readonly destination: {
+        readonly esm?: string | undefined;
+        readonly cjs: string;
+    };
+    readonly allDependencies: string[];
+    readonly externalDependencies: string[];
+    readonly platform: "node" | "browser";
+};

package/bin/bundler/metadata.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getMetadata = void 0;
+const path_1 = require("path");
+const constants_1 = require("../constants");
+const helpers_1 = require("../helpers");
+const getMetadata = () => {
+    const { dependencies = {}, devDependencies = {}, peerDependencies = {}, main, module, platform = "browser", source, } = require((0, path_1.resolve)(constants_1.CWD, "package.json"));
+    (0, helpers_1.assert)(main, "A `main` field is required in `package.json`. Did you forget to add it?");
+    (0, helpers_1.assert)(source, "A `source` field is required in `package.json`. Did you forget to add it?");
+    (0, helpers_1.assert)(["browser", "node"].includes(platform), "The `platform` package field can only accept `browser` or `node` value.");
+    const externalDependencies = Object.keys(peerDependencies);
+    const allDependencies = [
+        ...externalDependencies,
+        ...Object.keys(dependencies),
+        ...Object.keys(devDependencies),
+    ];
+    return {
+        source,
+        destination: Object.assign({ cjs: main }, (module && { esm: module })),
+        allDependencies,
+        externalDependencies,
+        platform,
+    };
+};
+exports.getMetadata = getMetadata;

package/bin/bundler/plugins.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from "esbuild";
+import type { TypeScriptConfiguration } from "./typescript";
+export declare const jsxPlugin: (dependencies: Array<string>, tsOptions: TypeScriptConfiguration | null) => Plugin;

package/bin/bundler/plugins.js

@@ -0,0 +1,32 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.jsxPlugin = void 0;
+const helpers_1 = require("../helpers");
+const jsxPlugin = (dependencies, tsOptions) => ({
+    name: "jsx",
+    setup(build) {
+        build.onLoad({ filter: /\.(j|t)sx$/ }, ({ path }) => __awaiter(this, void 0, void 0, function* () {
+            const module = ["preact", "react"].find((module) => dependencies.includes(module));
+            if (!module ||
+                !(0, helpers_1.resolveModulePath)(`${module}/jsx-runtime`) ||
+                (tsOptions === null || tsOptions === void 0 ? void 0 : tsOptions.hasJsxRuntime) === false) {
+                return;
+            }
+            const content = yield (0, helpers_1.readFile)(path, "utf8");
+            return {
+                contents: `import * as React from "${module}";${content}`,
+                loader: "tsx",
+            };
+        }));
+    },
+});
+exports.jsxPlugin = jsxPlugin;

package/bin/bundler/typescript.d.ts

@@ -0,0 +1,5 @@
+export declare type TypeScriptConfiguration = {
+    target?: string;
+    hasJsxRuntime?: boolean;
+};
+export declare const getTypeScriptOptions: () => Promise<TypeScriptConfiguration | null>;

package/bin/bundler/typescript.js

@@ -0,0 +1,56 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTypeScriptOptions = void 0;
+const path_1 = require("path");
+const constants_1 = require("../constants");
+const getTypeScriptOptions = () => __awaiter(void 0, void 0, void 0, function* () {
+    var _a;
+    try {
+        const ts = yield Promise.resolve().then(() => __importStar(require("typescript")));
+        const { jsx, target } = ts.parseJsonConfigFileContent(require((0, path_1.resolve)(constants_1.CWD, "tsconfig.json")), ts.sys, constants_1.CWD).options;
+        const esbuildTarget = !target ||
+            [ts.ScriptTarget.ESNext, ts.ScriptTarget.Latest].includes(target)
+            ? "esnext"
+            : (_a = ts.ScriptTarget[target]) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+        return {
+            target: esbuildTarget,
+            hasJsxRuntime: jsx !== undefined &&
+                [
+                    ts.JsxEmit["ReactJSX"],
+                    ts.JsxEmit["ReactJSXDev"],
+                ].includes(jsx),
+        };
+    }
+    catch (error) {
+        return null;
+    }
+});
+exports.getTypeScriptOptions = getTypeScriptOptions;

package/bin/helpers.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="node" />
+import { readFile as fsReadFile } from "fs";
+export declare const readFile: typeof fsReadFile.__promisify__;
+export declare const resolveModulePath: (path: string) => boolean;
+export declare function assert(condition: unknown, message: string): asserts condition;

package/bin/helpers.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.assert = exports.resolveModulePath = exports.readFile = void 0;
+const util_1 = require("util");
+const fs_1 = require("fs");
+const constants_1 = require("./constants");
+exports.readFile = (0, util_1.promisify)(fs_1.readFile);
+const resolveModulePath = (path) => {
+    try {
+        return Boolean(require.resolve(path, { paths: [constants_1.CWD] }));
+    }
+    catch (error) {
+        return false;
+    }
+};
+exports.resolveModulePath = resolveModulePath;
+function assert(condition, message) {
+    if (!condition) {
+        throw new Error(message);
+    }
+}
+exports.assert = assert;

package/bin/index.d.ts

@@ -1,2 +1,2 @@
 #!/usr/bin/env node
-export {};
+import "./program";

package/bin/index.js

@@ -1,16 +1,4 @@
 #!/usr/bin/env node
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const terminal_kit_1 = require("@adbayb/terminal-kit");
-terminal_kit_1.setup();
-const command = process.argv[2];
-switch (command) {
-    case "build":
-        require("./commands/build");
-        break;
-    case "watch":
-        require("./commands/watch");
-        break;
-    default:
-        throw new ReferenceError("Command not found");
-}
+require("./program");

package/bin/program/commands/build.d.ts

@@ -0,0 +1,13 @@
+import { Termost } from "termost";
+import { Metadata } from "../../bundler";
+interface BuildContext {
+    metadata: Metadata;
+    sizes: Array<{
+        filename: string;
+        raw: number;
+        gzip: number;
+    }>;
+    outfiles: Array<string>;
+}
+export declare const createBuildCommand: (program: Termost<BuildContext>) => void;
+export {};

package/bin/program/commands/build.js

@@ -0,0 +1,87 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createBuildCommand = void 0;
+const gzip_size_1 = __importDefault(require("gzip-size"));
+const bundler_1 = require("../../bundler");
+const helpers_1 = require("../../helpers");
+const createBuildCommand = (program) => {
+    program
+        .command({
+        name: "build",
+        description: "Build the source code in production mode",
+    })
+        .task({
+        key: "metadata",
+        label: "Retrieve information ⚙️",
+        handler() {
+            return __awaiter(this, void 0, void 0, function* () {
+                return (0, bundler_1.getMetadata)();
+            });
+        },
+    })
+        .task({
+        key: "outfiles",
+        label: ({ values }) => `Transpile to ${Object.keys(values.metadata.destination).join(", ")} bundles 👷‍♂️`,
+        handler({ values }) {
+            return __awaiter(this, void 0, void 0, function* () {
+                const targets = Object.keys(values.metadata.destination);
+                const bundle = yield (0, bundler_1.createBundler)(values.metadata, {
+                    isProduction: true,
+                });
+                return yield Promise.all(targets.map((target) => bundle(target)));
+            });
+        },
+    })
+        .task({
+        key: "sizes",
+        label: "Compute size 📐",
+        handler({ values }) {
+            return __awaiter(this, void 0, void 0, function* () {
+                return yield calculateBundleSize(values.outfiles);
+            });
+        },
+    })
+        .message({
+        handler({ values }, helpers) {
+            const padding = values.sizes
+                .map((item) => item.raw)
+                .reduce((pad, currentRawSize) => {
+                return Math.max(pad, String(currentRawSize).length);
+            }, 0) + 2;
+            values.sizes.forEach((item) => {
+                helpers.print([
+                    `${item.raw.toString().padStart(padding)} B raw`,
+                    `${item.gzip.toString().padStart(padding)} B gz`,
+                ], {
+                    label: item.filename,
+                    type: "information",
+                });
+            });
+        },
+    });
+};
+exports.createBuildCommand = createBuildCommand;
+const calculateBundleSize = (filenames) => __awaiter(void 0, void 0, void 0, function* () {
+    const calculateFileSize = (filename) => __awaiter(void 0, void 0, void 0, function* () {
+        const content = yield (0, helpers_1.readFile)(filename);
+        const gzSize = yield (0, gzip_size_1.default)(content);
+        return {
+            filename,
+            raw: content.byteLength,
+            gzip: gzSize,
+        };
+    });
+    return yield Promise.all(filenames.map((filename) => calculateFileSize(filename)));
+});

package/bin/program/commands/watch.d.ts

@@ -0,0 +1,9 @@
+import { Termost } from "termost";
+interface WatchContext {
+    callbacks: {
+        onError: () => void;
+        onSuccess: () => void;
+    };
+}
+export declare const createWatchCommand: (program: Termost<WatchContext>) => void;
+export {};

package/bin/program/commands/watch.js

@@ -0,0 +1,56 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createWatchCommand = void 0;
+const bundler_1 = require("../../bundler");
+const createWatchCommand = (program) => {
+    program
+        .command({
+        name: "watch",
+        description: "Watch and rebuild on any code change",
+    })
+        .task({
+        key: "callbacks",
+        label: "Setup watcher",
+        handler() {
+            return __awaiter(this, void 0, void 0, function* () {
+                const callbacks = { onError() { }, onSuccess() { } };
+                const bundle = yield (0, bundler_1.createBundler)((0, bundler_1.getMetadata)(), {
+                    isProduction: false,
+                    isWatchMode: true,
+                    onWatch(error) {
+                        if (error) {
+                            callbacks.onError();
+                            throw error;
+                        }
+                        else {
+                            callbacks.onSuccess();
+                        }
+                    },
+                });
+                bundle("esm");
+                return callbacks;
+            });
+        },
+    })
+        .message({
+        handler({ values }, helpers) {
+            const onNotify = (type) => {
+                console.clear();
+                helpers.print(`Last update at ${new Date().toLocaleTimeString()} 🔎\n`, { type });
+            };
+            values.callbacks.onSuccess = () => onNotify("success");
+            values.callbacks.onError = () => onNotify("error");
+            values.callbacks.onSuccess();
+        },
+    });
+};
+exports.createWatchCommand = createWatchCommand;

package/bin/program/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const termost_1 = require("termost");
+const build_1 = require("./commands/build");
+const watch_1 = require("./commands/watch");
+const createProgram = (...commandBuilders) => {
+    const program = (0, termost_1.termost)("The zero-configuration bundler powered by ESBuild");
+    for (const commandBuilder of commandBuilders) {
+        commandBuilder(program);
+    }
+};
+createProgram(build_1.createBuildCommand, watch_1.createWatchCommand);

package/bin/test.d.ts

@@ -0,0 +1,3 @@
+declare type AppProps = {};
+export declare const App: (_: AppProps) => any;
+export {};

package/bin/test.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.App = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const App = (_) => {
+    const [counter, setCounter] = react_1.useState(0);
+    return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [jsx_runtime_1.jsx("button", Object.assign({ onClick: () => setCounter(counter + 1) }, { children: "Increment" }), void 0), jsx_runtime_1.jsx("div", { children: counter }, void 0)] }, void 0));
+};
+exports.App = App;