sliftutils 0.6.4 → 0.6.6

package/builders/extensionBuild.ts

@@ -17,7 +17,7 @@ async function main() {
         .option("contentEntry", { type: "string", default: "./extContentScript.ts", desc: `Path to the entry point file` })
         .option("manifestPath", { type: "string", default: "./manifest.json", desc: `Path to the manifest.json file` })
         .option("assetsFolder", { type: "string", default: "./assets", desc: `Path to the assets folder` })
-        .option("outputFolder", { type: "string", default: "./build-nodejs", desc: `Output folder` })
+        .option("outputFolder", { type: "string", default: "./build-extension", desc: `Output folder` })
         .argv || {}
         ;
 
@@ -36,9 +36,6 @@ async function main() {
     if (!hasManifest) {
         throw new Error("No manifest file found. Please specify the manifest file with the --manifestPath option. Or, create the default file at ./manifest.json.");
     }
-    if (!hasAssets) {
-        throw new Error("No assets folder found. Please specify the assets folder with the --assetsFolder option. Or, create the default folder at ./assets.");
-    }
 
     await fs.promises.mkdir("./build-extension", { recursive: true });
 
@@ -56,24 +53,78 @@ async function main() {
     }
     await fs.promises.cp(yargObj.manifestPath, path.join(yargObj.outputFolder, "manifest.json"));
 
-    let filesCopied = 0;
+    // Parse manifest and collect referenced files
+    let manifestContent = await fs.promises.readFile(yargObj.manifestPath, "utf-8");
+    let manifest = JSON.parse(manifestContent);
 
-    for await (const file of getAllFiles(yargObj.assetsFolder)) {
-        let relativePath = path.relative(yargObj.assetsFolder, file);
-        let newPath = path.join(yargObj.outputFolder, "assets", relativePath);
-        // Only copy it if the timestamp has updated
-        async function getTimestamp(filePath: string): Promise<number> {
-            try {
-                const stats = await fs.promises.stat(filePath);
-                return stats.mtimeMs;
-            } catch (error) {
-                return 0;
+    // Collect all files to copy
+    let filesToCopy: string[] = [];
+
+    // Helper to add icons (can be string or object of strings)
+    function addIconPaths(icon: string | object | undefined) {
+        if (!icon) return;
+        if (typeof icon === "string") {
+            filesToCopy.push(icon);
+        } else if (typeof icon === "object") {
+            for (const iconPath of Object.values(icon)) {
+                if (typeof iconPath === "string") {
+                    filesToCopy.push(iconPath);
+                }
             }
         }
-        let newTimestamp = await getTimestamp(file);
-        let oldTimestamp = await getTimestamp(newPath);
-        if (newTimestamp > oldTimestamp) {
-            await fs.promises.cp(file, newPath);
+    }
+
+    // Add manifest-referenced files
+    if (manifest.action?.default_popup) filesToCopy.push(manifest.action.default_popup);
+    if (manifest.browser_action?.default_popup) filesToCopy.push(manifest.browser_action.default_popup);
+    if (manifest.page_action?.default_popup) filesToCopy.push(manifest.page_action.default_popup);
+    if (manifest.options_page) filesToCopy.push(manifest.options_page);
+    if (manifest.options_ui?.page) filesToCopy.push(manifest.options_ui.page);
+    if (manifest.devtools_page) filesToCopy.push(manifest.devtools_page);
+    if (manifest.sidebar_action?.default_panel) filesToCopy.push(manifest.sidebar_action.default_panel);
+    if (manifest.chrome_url_overrides?.newtab) filesToCopy.push(manifest.chrome_url_overrides.newtab);
+    if (manifest.chrome_url_overrides?.bookmarks) filesToCopy.push(manifest.chrome_url_overrides.bookmarks);
+    if (manifest.chrome_url_overrides?.history) filesToCopy.push(manifest.chrome_url_overrides.history);
+
+    // Add icons
+    addIconPaths(manifest.icons);
+    addIconPaths(manifest.action?.default_icon);
+    addIconPaths(manifest.browser_action?.default_icon);
+    addIconPaths(manifest.page_action?.default_icon);
+
+    // Add assets folder files if it exists
+    if (hasAssets) {
+        for await (const file of getAllFiles(yargObj.assetsFolder)) {
+            filesToCopy.push(file);
+        }
+    }
+
+    // Copy all files with timestamp checking
+    async function getTimestamp(filePath: string): Promise<number> {
+        try {
+            const stats = await fs.promises.stat(filePath);
+            return stats.mtimeMs;
+        } catch (error) {
+            return 0;
+        }
+    }
+
+    let filesCopied = 0;
+    let root = path.resolve(".");
+    for (const file of filesToCopy) {
+        let sourcePath = path.resolve(file);
+        if (!fs.existsSync(sourcePath)) {
+            console.warn(`Warning: File not found: ${file}`);
+            continue;
+        }
+        let relativePath = path.relative(root, sourcePath);
+        let destPath = path.join(yargObj.outputFolder, relativePath);
+
+        let sourceTimestamp = await getTimestamp(sourcePath);
+        let destTimestamp = await getTimestamp(destPath);
+        if (sourceTimestamp > destTimestamp) {
+            await fs.promises.mkdir(path.dirname(destPath), { recursive: true });
+            await fs.promises.cp(sourcePath, destPath);
             filesCopied++;
         }
     }

package/builders/webBuild.ts

@@ -0,0 +1,89 @@
+import fs from "fs";
+import { delay } from "socket-function/src/batching";
+import { bundleEntryCaller } from "../bundler/bundleEntryCaller";
+import yargs from "yargs";
+import { formatTime } from "socket-function/src/formatting/format";
+import path from "path";
+import { getAllFiles } from "../misc/fs";
+
+async function main() {
+    let time = Date.now();
+    let yargObj = yargs(process.argv)
+        .option("entryPoint", { type: "string", default: "./browser.tsx", desc: `Path to the entry point file` })
+        .option("indexHtml", { type: "string", default: "./index.html", desc: `Path to the index.html file` })
+        .option("assetsFolder", { type: "string", default: "./assets", desc: `Path to the assets folder` })
+        .option("outputFolder", { type: "string", default: "./build-web", desc: `Output folder` })
+        .argv || {}
+        ;
+
+
+    // Wait for any async functions to load. 
+    await delay(0);
+
+    let hasEntryPoint = fs.existsSync(yargObj.entryPoint);
+    let hasIndexHtml = fs.existsSync(yargObj.indexHtml);
+    let hasAssets = fs.existsSync(yargObj.assetsFolder);
+
+    if (!hasEntryPoint) {
+        throw new Error(`Entry point not found at ${yargObj.entryPoint}. Please specify the entry point with the --entryPoint option.`);
+    }
+
+    await fs.promises.mkdir(yargObj.outputFolder, { recursive: true });
+
+    await bundleEntryCaller({
+        entryPoint: yargObj.entryPoint,
+        outputFolder: yargObj.outputFolder,
+    });
+
+    // Collect all files to copy
+    let filesToCopy: string[] = [];
+
+    if (hasIndexHtml) {
+        filesToCopy.push(yargObj.indexHtml);
+    }
+
+    // Add assets folder files if it exists
+    if (hasAssets) {
+        for await (const file of getAllFiles(yargObj.assetsFolder)) {
+            filesToCopy.push(file);
+        }
+    }
+
+    // Copy all files with timestamp checking
+    async function getTimestamp(filePath: string): Promise<number> {
+        try {
+            const stats = await fs.promises.stat(filePath);
+            return stats.mtimeMs;
+        } catch (error) {
+            return 0;
+        }
+    }
+
+    let filesCopied = 0;
+    let root = path.resolve(".");
+    for (const file of filesToCopy) {
+        let sourcePath = path.resolve(file);
+        if (!fs.existsSync(sourcePath)) {
+            console.warn(`Warning: File not found: ${file}`);
+            continue;
+        }
+        let relativePath = path.relative(root, sourcePath);
+        let destPath = path.join(yargObj.outputFolder, relativePath);
+
+        let sourceTimestamp = await getTimestamp(sourcePath);
+        let destTimestamp = await getTimestamp(destPath);
+        if (sourceTimestamp > destTimestamp) {
+            await fs.promises.mkdir(path.dirname(destPath), { recursive: true });
+            await fs.promises.cp(sourcePath, destPath);
+            filesCopied++;
+        }
+    }
+    if (filesCopied > 0) {
+        console.log(`Copied ${filesCopied} changed files`);
+    }
+
+    let duration = Date.now() - time;
+    console.log(`Web build completed in ${formatTime(duration)}`);
+}
+main().catch(console.error).finally(() => process.exit());
+

package/builders/webBuildRun.js

@@ -0,0 +1,4 @@
+#!/usr/bin/env node
+require("typenode");
+require("./webBuild.ts");
+

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "sliftutils",
-    "version": "0.6.4",
+    "version": "0.6.6",
     "main": "index.js",
     "license": "MIT",
     "scripts": {
@@ -9,7 +9,9 @@
         "notes": "mobx, preact, socket-function, typenode SHOULD be peerDependencies. But we want to use yarn (better dependency deduplication), so we can't use peerDependencies (as they aren't installed by default, which makes them a nightmare to use). If you want to override the versions, feel free to use overrides/resolutions."
     },
     "bin": {
-        "build-nodejs": "./builders/nodeJSBuildRun.js"
+        "build-nodejs": "./builders/nodeJSBuildRun.js",
+        "build-extension": "./builders/extensionBuildRun.js",
+        "build-web": "./builders/webBuildRun.js"
     },
     "dependencies": {
         "@types/shell-quote": "^1.7.5",

package/spec.txt

@@ -4,10 +4,6 @@ TODO:
     4) New project with:
 
         We need bins and entry points for the common types of builds
-            extension
-                copy manifest.json
-                build background.ts, copy it
-                build content.ts, copy it
             site
                 build site, copy it
             electron
@@ -15,15 +11,30 @@ TODO:
                 build render process, copy it
                 copy the json config file?
 
-        build-nodejs
-        build-electron
-        build-extension
         build-web
+            - I guess it's the same as the Node.js build.
+                - index.html file, which is optional. 
+                - Assets folder, which is optional. 
+        build-electron
 
         watch helper script in bin
             - And have it automatically ignore .gitignored files
             - And have it also watch .watchignore
+            - accepts port argument to broadcast when the build changes
 
+        watcher port, and helper function for hot reloading (watchHotReload)
+            - accepts port argument
+            - if in the browser, refreshes
+                - warns if it can't connect to the socket, specifying the watch script that should be used
+            - in nodejs, instead use socket-function hot reloading
+                - import { onHotReload, watchFilesAndTriggerHotReloading } from "socket-function/hot/HotReloadController";
+            - in electron watches and refreshes (no per file reloading)
+            - in chrome extension
+                - errors if called in content script (must be called in background script)
+                - reloads extension
+                - option to refresh content script pages in overall watch function
+                    - On load, if reloaded in the last 10s, tells any pages which loaded content script to refresh their page
+        
         - HELPER bin to setup the project with:
             (Only if the files don't exist)
             tsconfig.json
@@ -37,8 +48,11 @@ TODO:
                 - socket-function
                 - typesafecss
                 - typedev
-            index.ts and index.html
+            add the basic entry points for Node.js, the browser, the browser HTML file, and even some files for a Chrome extension, and even for an Electron app. 
+                - We'll make Electron optional though, and so they'll have to manually install Electron if they want to make an Electron app. We can check for this and warn if they try to build electron without having electron installed. 
             Add build and type commands to package.json
+                - We have the binaries for the build commands, but adding them to packs.json makes it a lot more discoverable. 
+                - And it's just very good practice to add the type command to package.json. That way you could just say, what does this command do to the AI? and it'll tell you exactly what it does, instead of nesting 
 
     EXPOSE our helpers in our main export, in an index.ts file?
         - Will this let us just import them? Hmm...