host-mdx 2.3.0 → 2.4.0

package/README.md

@@ -1,4 +1,4 @@
-# host-mdx
+# 🌐 host-mdx
 
 [![Version](https://img.shields.io/npm/v/host-mdx.svg)](https://www.npmjs.com/package/host-mdx)\
 A cli tool to create and serve a static html website from a given mdx directory
@@ -50,15 +50,15 @@ hostMdx.start();
 
 ### Additional:
 
-You can add a file by the name `.hostmdxignore` at the root of your project to filter out which files/folders to skip while generating html
+You can add `.hostmdxignore` at the root of your project to filter out which files/folders to skip while generating html
 (similar to [.gitignore](https://git-scm.com/docs/gitignore))
 
-You can also add a file by the name `host-mdx.js` at the root of your input folder as a config file (Look at the example below for all available options)
+You can also add `host-mdx.js` at the root of your project as an optional config file for more complex behaviour (Look at the example below for all available options)
 
 
 > **Note:**  
 > 1. Any config properties passed from npx or import e.g. `port`, `toBeVerbose`, `trackChanges`, etc will override `host-mdx.js` export values
-> 1. Any changes made to `host-mdx.js` or any new package added requires complete restart otherwise changes will not reflect due to [this bug](https://github.com/nodejs/node/issues/49442)
+> 1. Any changes made to `host-mdx.js` or any new packages added require complete restart otherwise changes will not reflect due to [this bug](https://github.com/nodejs/node/issues/49442)
 
 <br/>
 
@@ -82,9 +82,9 @@ Input Directory:
 
 ```
 my-website-template/
+├─ .hostmdxignore
 ├─ 404.mdx
 ├─ index.mdx
-├─ .hostmdxignore
 ├─ host-mdx.js
 ├─ about/
 │  ├─ index.mdx
@@ -124,23 +124,23 @@ export async function onHostStarted(inputPath, outputPath, port) {
 export async function onHostEnded(inputPath, outputPath, port) {
    console.log("onHostEnded");
 }
-export async function onSiteCreateStart(inputPath, outputPath) {
+export async function onSiteCreateStart(inputPath, outputPath, isSoftReload) {
    console.log("onSiteCreateStart");
 }
-export async function onSiteCreateEnd(inputPath, outputPath, wasInterrupted) {
+export async function onSiteCreateEnd(inputPath, outputPath, isSoftReload, wasInterrupted) {
    console.log("onSiteCreateEnd");
 }
-export async function onFileCreateStart(inputFilePath, outputFilePath, inFilePath, outFilePath) {
-   console.log("onFileCreateStart");
+export async function onFileChangeStart(inputPath, outputPath, inFilePath, outFilePath, toBeDeleted) {
+   console.log("onFileChangeStart");
 }
-export async function onFileCreateEnd(inputFilePath, outputFilePath, inFilePath, outFilePath, result) {
+export async function onFileChangeEnd(inputPath, outputPath, inFilePath, outFilePath, wasDeleted, result) {
    // `result = undefined` if file is not .mdx
    // `result.html` contains stringified HTML
    // `result.exports` contains exports from mdx
-   console.log("onFileCreateEnd");
+   console.log("onFileChangeEnd");
 }
-export async function toIgnore(inputPath, outputPath, path) {
-   const isGOutputStream = /\.goutputstream-\w+$/.test(path);
+export async function toIgnore(inputPath, outputPath, targetPath) {
+   const isGOutputStream = /\.goutputstream-\w+$/.test(targetPath);
    if (isGOutputStream) {
       return true;
    }
@@ -148,7 +148,8 @@ export async function toIgnore(inputPath, outputPath, path) {
    return false;
 }
 export async function modMDXCode(inputPath, outputPath, inFilePath, outFilePath, code){
-   // Modify code ...
+   // Wrapper example
+   code = `import Content from "${inFilePath}"; import { Wrapper } from "utils.jsx";\n\n<Wrapper><Content /></Wrapper>`
    return code;
 }
 export async function modGlobalArgs(inputPath, outputPath, globalArgs){
@@ -156,13 +157,31 @@ export async function modGlobalArgs(inputPath, outputPath, globalArgs){
    return globalArgs;
 }
 export async function modBundleMDXSettings(inputPath, outputPath, settings) {
-   // Modify settings ...
+   // Example for adding '@' root alias
+   var oldBuildOptions = settings.esbuildOptions;
+   settings.esbuildOptions = (options) => {
+      options = oldBuildOptions(options)
+      options.logLevel = 'error';
+      options.alias = {
+         ...options.alias,
+         '@': inputPath
+      };
+
+      return options;
+   }
+
+
    return settings;
 }
 export async function modRebuildPaths(inputPath, outputPath, rebuildPaths) {
    // Modify rebuildPaths ...
    return rebuildPaths;
 }
+export async function canTriggerReload(inputPath, outputPath, targetPath) {
+   const ignoredDirs = new Set(['node_modules', '.git', '.github']);
+   const segments = targetPath.split(/[\\/]/);  // or targetPath.split(path.sep);
+   return !segments.some(segment => ignoredDirs.has(segment));
+}
 export const chokidarOptions = {
    awaitWriteFinish: true
 }

package/cli.js

@@ -2,7 +2,7 @@
 
 import path from "path";
 import * as readline from "readline";
-import { HostMdx, createSite, TrackChanges, log } from "./index.js";
+import { HostMdx, createSite, TrackChanges, setupConfigs, log } from "./index.js";
 
 
 // Flags
@@ -41,7 +41,7 @@ ${VERBOSE_FLAG}, ${VERBOSE_SHORT_FLAG}             Shows additional log messages
 function getInputPathFromArgs(rawArgs) {
     let inputPath = rawArgs.find(val => val.startsWith(INPUT_PATH_FLAG));
     let inputPathProvided = inputPath !== undefined;
-    inputPath = inputPathProvided ? inputPath.split('=')?.[1] : "";
+    inputPath = inputPathProvided ? inputPath.split('=')?.[1] : process.cwd();
     return inputPath !== "" ? path.resolve(inputPath) : inputPath;  // To ensure input path is absolute
 }
 function getOutputPathFromArgs(rawArgs) {
@@ -132,7 +132,8 @@ export async function main() {
     let toCreateOnly = rawArgs.includes(CREATE_FLAG) || rawArgs.includes(CREATE_SHORT_FLAG);
     if (toCreateOnly) {
         try {
-            await createSite(inputPath, outputPath, null, undefined, { toBeVerbose });
+            let configs = await setupConfigs(inputPath);
+            await createSite(inputPath, outputPath, null, undefined, { ...configs, toBeVerbose });
         }
         catch (err) {
             process.exitCode = 1;  // Exit with error code if not created successfully
@@ -176,7 +177,10 @@ export async function main() {
     // Watch for key press
     listenForKey(
         async () => await hostMdx?.recreateSite(),
-        async () => await hostMdx?.recreateSite(true),
+        async () => {
+            log("--- HARD RELOADING ---")
+            await hostMdx?.recreateSite(true)
+        },
         cleanup
     );
 

package/dependency-graph.js

@@ -0,0 +1,340 @@
+import fs from "fs";
+import path from "path";
+import resolve from 'resolve';
+import precinct from 'precinct';
+import * as mdx from '@mdx-js/mdx';
+
+
+// Properties
+const DEPENDENTS_KEY = "dependents";
+const DEPENDENCIES_KEY = "dependencies";
+
+
+// Methods
+export async function crawlDir(dir, ignoreCheck = async (p) => false) {
+
+    // Make sure dir is absolute
+    dir = path.resolve(dir);
+
+
+    // Iterate through all files in dir
+    let results = [];
+    const list = fs.readdirSync(dir);
+    for (let somePath of list) {
+
+        // get absolute path
+        const absPath = path.join(dir, somePath);
+
+
+        // Skip if to ignore
+        if (await ignoreCheck(absPath)) {
+            continue;
+        }
+
+
+        // If directory, Recurse into it
+        const stat = fs.statSync(absPath);
+        if (stat && stat.isDirectory()) {
+            results = results.concat(await crawlDir(absPath, ignoreCheck));
+            continue;
+        }
+
+
+        // If file, Add to list
+        results.push(absPath);
+    }
+
+    return results;
+}
+export function resolveAlias(somePath, aliases) {
+    for (const [alias, aliasPath] of Object.entries(aliases)) {
+
+        // Check if import is the alias or starts with alias + system separator
+        const isExact = somePath === alias;
+        const isSubPath = somePath.startsWith(`${alias}${path.sep}`) || somePath.startsWith(`${alias}/`);
+
+        if (isExact || isSubPath) {
+            somePath = somePath.replace(alias, aliasPath);
+            somePath = path.normalize(somePath);
+            break;
+        }
+    }
+
+    return somePath;
+}
+export function ensureRelativePath(rootPath, filePath) {
+    const absoluteTarget = path.resolve(rootPath, filePath);
+    const absoluteRoot = path.resolve(rootPath);
+    return path.relative(absoluteRoot, absoluteTarget);
+}
+export async function calcDependencies(filePath, aliases = {}) {
+
+    // Return if given path has already been traversed or is a node_modules
+    const absolutePath = path.resolve(filePath);
+    if (absolutePath.includes('node_modules')) {
+        return new Set();
+    }
+
+
+    // Compile mdx if passed
+    let foundImports = [];
+    if (absolutePath.endsWith('.mdx')) {
+        let content = fs.readFileSync(absolutePath, 'utf8');
+        const compiled = await mdx.compile(content);
+        content = String(compiled?.value ?? "");
+        foundImports = precinct(content);
+    }
+    else {
+        foundImports = precinct.paperwork(absolutePath);
+    }
+
+
+    // Get & iterate through all imports
+    let filteredImports = [];
+    for (let i of foundImports) {
+
+        // Resolve aliases
+        i = resolveAlias(i, aliases);
+
+
+        // Skip if not a local file
+        const isLocal = i.startsWith('.') || i.startsWith('/');
+        if (!isLocal) {
+            continue;
+        }
+
+
+        // Resolve the found import
+        let resolvedPath = "";
+        try {
+            resolvedPath = resolve.sync(i, { basedir: path.dirname(absolutePath) }); // extensions: ['.js', '.jsx', '.mdx', '.json', '.tsx', '.ts']
+        }
+        catch (err) {
+            continue;
+        }
+
+
+        // Skip if the resolved path is within node_modules
+        if (resolvedPath.includes('node_modules')) {
+            continue;
+        }
+
+
+        // Add path as a dependency
+        filteredImports.push(resolvedPath);
+    }
+
+
+    return new Set(filteredImports);
+}
+
+
+// classes
+export class DependencyGraph {
+
+    // Private Properties
+    #graph = {};  // Format { "path/to/file" : { dependents: Set(...), dependencies : Set(...) }, ... }
+    #aliases = {};  // Format { '@' : "path/to/dir" }
+    #rootFolder = "";
+    #ignoreCheck = async (checkPath) => false;
+
+
+    // Public Methods
+    getGraph() {
+        return structuredClone(this.#graph);
+    }
+    async createGraph(newRootFolder, newIgnoreCheck = async (checkPath) => false) {
+        this.#graph = {};
+        this.#rootFolder = path.resolve(newRootFolder);
+        this.#ignoreCheck = newIgnoreCheck;
+
+
+        // Get all files inside directory
+        const allFiles = await crawlDir(this.#rootFolder, this.#ignoreCheck);
+
+
+        // Assign all dependencies
+        for (const file of allFiles) {
+            await this.addEntry(file);
+        }
+    }
+    async addEntry(filePath) {
+
+        // Get relative path
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+
+
+        // Get all dependencies
+        const absFilePath = path.resolve(this.#rootFolder, relFilePath);
+        const dependencies = await calcDependencies(absFilePath, this.#aliases);
+        const relDependencies = new Set();
+        dependencies.forEach(p => {
+            relDependencies.add(path.relative(this.#rootFolder, p));
+        })
+
+
+        // Skip if no dependencies
+        if (dependencies.size === 0) {
+            return;
+        }
+
+
+        // Add dependencies
+        this.#graph[relFilePath] = {
+            [DEPENDENCIES_KEY]: relDependencies,
+            [DEPENDENTS_KEY]: new Set()
+        };
+
+
+        // Add dependents
+        const depList = this.#graph[relFilePath][DEPENDENCIES_KEY];
+        depList.forEach(dep => {
+            if (this.#graph[dep] === undefined) {
+                this.#graph[dep] = {
+                    [DEPENDENCIES_KEY]: new Set(),
+                    [DEPENDENTS_KEY]: new Set()
+                }
+            }
+
+            this.#graph[dep][DEPENDENTS_KEY].add(relFilePath);
+        });
+    }
+    removeEntry(filePath) {
+
+        // Get relative path
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+
+
+        // Return if entry does not exist
+        if (this.#graph[relFilePath] === undefined) {
+            return;
+        }
+
+
+        // Remove from dependents
+        const depList = this.#graph[relFilePath][DEPENDENCIES_KEY];
+        depList.forEach(dep => {
+            if (this.#graph[dep] === undefined) {
+                return;
+            }
+
+            this.#graph[dep][DEPENDENTS_KEY].delete(relFilePath);
+        });
+
+
+        // Remove entry
+        delete this.#graph[relFilePath];
+    }
+    hasEntry(filePath) {
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+        return this.#graph[relFilePath] !== undefined;
+    }
+    getEntry(filePath) {
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+        return this.#graph[relFilePath];
+    }
+    getDependencies(filePath) {
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+        let absDeps = new Set();
+        let deps = this.#graph?.[relFilePath]?.[DEPENDENCIES_KEY] ?? new Set();
+        for (const dep of deps) {
+            absDeps.add(path.resolve(this.#rootFolder, dep));
+        }
+
+        return absDeps;
+    }
+    getDeepDependencies(filePath) {
+
+        // Get relative path
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+
+
+        // Return empty set if entry does not exist
+        if (!this.hasEntry(relFilePath)) {
+            return new Set();
+        }
+
+
+        // Recursively get dependencies
+        const deepDeps = new Set();
+        const walk = (currentPath) => {
+
+            // Skip if not in graph
+            const deps = this.getDependencies(currentPath);
+            if (!deps) {
+                return;
+            }
+
+            // Iterate over all dependencies
+            deps.forEach(dep => {
+                if (deepDeps.has(dep)) {
+                    return;
+                }
+
+                // Add to list and continue walking
+                deepDeps.add(dep);
+                walk(dep);
+            });
+        };
+        walk(relFilePath);
+
+        return deepDeps;
+    }
+    getDependents(filePath) {
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+        let absDeps = new Set();
+        let deps = this.#graph?.[relFilePath]?.[DEPENDENTS_KEY] ?? new Set();
+        for (const dep of deps) {
+            absDeps.add(path.resolve(this.#rootFolder, dep));
+        }
+
+        return absDeps;
+    }
+    getDeepDependents(filePath) {
+
+        // Get relative path
+        let relFilePath = ensureRelativePath(this.#rootFolder, filePath);
+
+
+        // Return empty set if entry does not exist
+        if (!this.hasEntry(relFilePath)) {
+            return new Set();
+        }
+
+
+        // Recursively get dependents
+        const deepDependents = new Set();
+        const walk = (currentPath) => {
+
+            // Skip if not in graph
+            const dependents = this.getDependents(currentPath);
+            if (!dependents) {
+                return;
+            }
+
+            // Iterate over all dependencies
+            dependents.forEach(dependent => {
+                if (deepDependents.has(dependent)) {
+                    return;
+                }
+
+                // Add to list and continue walking
+                deepDependents.add(dependent);
+                walk(dependent);
+            });
+        };
+        walk(relFilePath);
+        
+
+        return deepDependents;
+    }
+    addAlias(symbol, toPath) {
+        this.#aliases[symbol] = toPath;
+    }
+    removeAlias(symbol) {
+        delete this.#aliases[symbol];
+    }
+    setAlias(newAliases) {
+        this.#aliases = newAliases;
+    }
+}

package/index.js

@@ -1,6 +1,7 @@
 import fs from "fs";
 import os from "os";
 import net from "net";
+import _ from 'lodash';
 import path from "path";
 import sirv from "sirv";
 import polka from "polka";
@@ -10,6 +11,7 @@ import chokidar from "chokidar";
 import { pathToFileURL } from "url";
 import { promises as fsp } from "fs";
 import { mdxToHtml } from "./mdx-to-html.js";
+import { DependencyGraph, crawlDir } from "./dependency-graph.js";
 
 
 // Enums
@@ -60,6 +62,19 @@ const LOG_TIME_OPTIONS = {
 const DEFAULT_CHOKIDAR_OPTIONS = {
     ignoreInitial: true
 };
+const DEFAULT_CONFIGS = {
+    // port: 3000,  // Intentionally kept commented out, otherwise interferes with auto port assigning DO NOT CHANGE
+    chokidarOptions: DEFAULT_CHOKIDAR_OPTIONS,
+    trackChanges: 0,
+    toBeVerbose: false,
+    concurrency: 1,
+    chokidarOptions: DEFAULT_CHOKIDAR_OPTIONS,
+    canTriggerReload: (inputPath, outputpath, p) => {
+        const ignoredDirs = new Set(['node_modules', '.git', '.github']);
+        const segments = p.split(path.sep);
+        return !segments.some(segment => ignoredDirs.has(segment));
+    }
+};
 
 
 // Utility Methods
@@ -79,19 +94,6 @@ async function createFile(filePath, fileContent = "") {
     await fsp.mkdir(fileLocation, { recursive: true });
     await fsp.writeFile(filePath, fileContent);
 }
-function crawlDir(dir) {
-    const absDir = path.resolve(dir);
-    let entries = fs.readdirSync(absDir, { recursive: true });
-    return entries.map(file => path.join(absDir, file));
-}
-async function setupConfigs(configFilePath) {
-    if (fs.existsSync(configFilePath)) {
-        let cleanConfigFilePath = pathToFileURL(configFilePath).href
-        return await import(cleanConfigFilePath);
-    }
-
-    return {};
-}
 async function startServer(hostDir, port, errorCallback) {  // Starts server at given port
 
     // Make sure host dir path is absolute
@@ -177,6 +179,16 @@ export function isPathInside(parentPath, childPath) {
         relation !== path.resolve(childPath)
     );
 }
+export async function setupConfigs(inputPath) {
+
+    let configFilePath = path.join(inputPath, CONFIG_FILE_NAME);
+    if (fs.existsSync(configFilePath)) {
+        let cleanConfigFilePath = pathToFileURL(configFilePath).href
+        return { ...DEFAULT_CONFIGS, ...(await import(cleanConfigFilePath)) };
+    }
+
+    return _.cloneDeep(DEFAULT_CONFIGS);
+}
 export function createTempDir() {
     // Create default temp html dir
     fs.mkdirSync(TEMP_HTML_DIR, { recursive: true });
@@ -238,7 +250,7 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
 
     // Check if `inputPath` is inside `outputPath` (causing code wipeout)
     if (isPathInside(outputPath, inputPath)) {
-        throw `Input path "${inputPath}" cannot be inside or same as output path "${outputPath}"`;
+        throw new Error(`Input path "${inputPath}" cannot be inside or same as output path "${outputPath}"`);
     }
 
 
@@ -253,9 +265,10 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
 
 
     // Hard reload, clear output path & Get all paths from `inputPath`
-    if (pathsToCreate == null) {
+    let isHardReloading = pathsToCreate == null;
+    if (isHardReloading) {
         emptyDir(outputPath)
-        pathsToCreate = crawlDir(inputPath);
+        pathsToCreate = await crawlDir(inputPath);
     }
 
 
@@ -271,7 +284,7 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
         let configFilePath = path.join(inputPath, `./${CONFIG_FILE_NAME}`);
         let doesConfigFileExists = fs.existsSync(configFilePath);
         log(`Importing config file ${configFilePath}`, !doesConfigFileExists);
-        configs = await setupConfigs(configFilePath);
+        configs = await setupConfigs(inputPath);
     }
 
 
@@ -319,8 +332,8 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
 
 
     // Broadcast site creation started
-    log("Creating site...");
-    await configs?.onSiteCreateStart?.(inputPath, outputPath);
+    log(`Starting site creation at ${outputPath} ...`);
+    await configs?.onSiteCreateStart?.(inputPath, outputPath, !isHardReloading);
 
 
     // Iterate through all folders & files
@@ -347,21 +360,23 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
         if (!pathExists) {
             let pathToDelete = isMdx ? absHtmlPath : absToOutput;
             log(`Deleting ${pathToDelete}`, !toBeVerbose);
+            await configs?.onFileChangeStart?.(inputPath, outputPath, pathToDelete, absToOutput, true);
             await fsp.rm(pathToDelete, { recursive: true, force: true });
+            await configs?.onFileChangeEnd?.(inputPath, outputPath, pathToDelete, absToOutput, true, undefined);
         }
         // Make corresponding directory
         else if (isDir) {
             log(`Creating ${currentPath} ---> ${absToOutput}`, !toBeVerbose);
-            await configs?.onFileCreateStart?.(inputPath, outputPath, currentPath, absToOutput);
+            await configs?.onFileChangeStart?.(inputPath, outputPath, currentPath, absToOutput, false);
             await fsp.mkdir(absToOutput, { recursive: true });
-            await configs?.onFileCreateEnd?.(inputPath, outputPath, currentPath, absToOutput, undefined);
+            await configs?.onFileChangeEnd?.(inputPath, outputPath, currentPath, absToOutput, false, undefined);
         }
         // Make html file from mdx
         else if (isMdx) {
 
             // Broadcast file creation started
             log(`Creating ${currentPath} ---> ${absHtmlPath}`, !toBeVerbose);
-            await configs?.onFileCreateStart?.(inputPath, outputPath, currentPath, absHtmlPath);
+            await configs?.onFileChangeStart?.(inputPath, outputPath, currentPath, absHtmlPath, false);
 
 
             // Intercept mdx code
@@ -380,22 +395,22 @@ export async function createSite(inputPath = "", outputPath = "", pathsToCreate
 
 
             // Broadcast file creation ended
-            await configs?.onFileCreateEnd?.(inputPath, outputPath, currentPath, absHtmlPath, result);
+            await configs?.onFileChangeEnd?.(inputPath, outputPath, currentPath, absHtmlPath, false, result);
         }
         // Copy paste file
         else {
-            log(`Creating ${currentPath} ---> ${absToOutput}`, !configs.toBeVerbose);
-            await configs?.onFileCreateStart?.(inputPath, outputPath, currentPath, absToOutput);
+            log(`Creating ${currentPath} ---> ${absToOutput}`, !toBeVerbose);
+            await configs?.onFileChangeStart?.(inputPath, outputPath, currentPath, absToOutput, false);
             await fsp.mkdir(path.dirname(absToOutput), { recursive: true });
             await fsp.copyFile(currentPath, absToOutput);
-            await configs?.onFileCreateEnd?.(inputPath, outputPath, currentPath, absToOutput, undefined);
+            await configs?.onFileChangeEnd?.(inputPath, outputPath, currentPath, absToOutput, false, undefined);
         }
     })));
 
 
     // Broadcast site creation ended
-    log(wasInterrupted ? `Site creation was interrupted!` : `Created site at ${outputPath}`);
-    await configs?.onSiteCreateEnd?.(inputPath, outputPath, wasInterrupted);
+    log(wasInterrupted ? `Site creation was interrupted!` : `Completed site creation at ${outputPath}`);
+    await configs?.onSiteCreateEnd?.(inputPath, outputPath, !isHardReloading, wasInterrupted);
 }
 
 
@@ -411,6 +426,7 @@ export class HostMdx {
     #app = null;
     #watcher = null;
     #ignores = null;
+    #depGraph = new DependencyGraph();
 
 
     // Constructors
@@ -424,28 +440,18 @@ export class HostMdx {
     // Private Methods
     async #watchForChanges(event, somePath) {
 
-        // Return if out input path itself if passed
-        if (this.inputPath === somePath) {
-            return;
+        // Update dependency graph
+        if (event === "unlink") {
+            this.#depGraph.removeEntry(somePath);
         }
-
-
-        // Return if matches .ignore file
-        const relToInput = path.relative(this.inputPath, somePath);
-        if (this.#ignores.ignores(relToInput)) {
-            return;
-        }
-
-
-        // Return if toIgnore() from configs
-        const toIgnore = await this.configs?.toIgnore?.(this.inputPath, this.outputPath, somePath);
-        if (toIgnore) {
-            return;
+        else {
+            this.#depGraph.addEntry(somePath);
         }
 
 
         // Add changed path
-        this.#alteredPaths.push(somePath);
+        let dependencies = this.#depGraph.getDeepDependents(somePath);
+        this.#alteredPaths = this.#alteredPaths.concat([...dependencies, somePath]);
 
 
         // Reflect changes immediately
@@ -470,7 +476,7 @@ export class HostMdx {
         await this.stop();
 
 
-        // Asssign all
+        // Assign all
         this.#inputPathProvided = this.inputPath !== "";
         this.#outputPathProvided = this.outputPath !== "";
         this.inputPath = this.#inputPathProvided ? this.inputPath : process.cwd();
@@ -481,7 +487,7 @@ export class HostMdx {
         let configFilePath = path.join(this.inputPath, `./${CONFIG_FILE_NAME}`);
         let doesConfigFileExists = fs.existsSync(configFilePath);
         log(`Importing config file ${configFilePath}`, !doesConfigFileExists);
-        this.configs = { ...(await setupConfigs(configFilePath)), ...this.configs };
+        this.configs = { ...(await setupConfigs(this.inputPath)), ...this.configs };
 
 
         // Get port
@@ -507,13 +513,21 @@ export class HostMdx {
 
         // Watch for changes
         let chokidarOptions = { ...DEFAULT_CHOKIDAR_OPTIONS, ...(this.configs?.chokidarOptions ?? {}) };
-        this.#watcher = chokidar.watch(this.inputPath, chokidarOptions).on("all", (event, path) => this.#watchForChanges(event, path));
+        this.#watcher = chokidar.watch(this.inputPath, chokidarOptions).on("all", (event, targetPath) => this.#watchForChanges(event, targetPath));
 
 
         // Delete old files & Create site
         await this.recreateSite(true);
 
 
+        // Create dependency graph 
+        let defaultMdxSettings = { esbuildOptions: () => ({}) };
+        let modMdxSettings = await this.configs?.modBundleMDXSettings?.(this.inputPath, this.outputPath, defaultMdxSettings);
+        let aliases = modMdxSettings?.esbuildOptions?.({})?.alias ?? {};
+        this.#depGraph.setAlias(aliases);
+        await this.#depGraph.createGraph(this.inputPath, async (p) => !(await this.configs?.canTriggerReload?.(this.inputPath, this.outputPath, p)));
+
+
         // Start server to host site
         this.#app = await startServer(this.outputPath, port, (e) => { log(`Failed to start server: ${e.message}`); throw e; });
         this.#app?.server?.on("close", async () => { await this.configs?.onHostEnded?.(this.inputPath, this.outputPath, port); });
@@ -542,7 +556,7 @@ export class HostMdx {
         if (this.#siteCreationStatus == SiteCreationStatus.ONGOING) {
             log("Site creation already ongoing! Added to pending")
             this.#siteCreationStatus = SiteCreationStatus.PENDING_RECREATION;
-            this.#pendingHardSiteCreation = hardReload;
+            this.#pendingHardSiteCreation = this.#pendingHardSiteCreation || hardReload;
             return;
         }
 
@@ -554,8 +568,8 @@ export class HostMdx {
         // Actual site creation
         try {
             let pathsToCreate = hardReload ? null : [...this.#alteredPaths];
-            this.#alteredPaths = [];
             await createSite(this.inputPath, this.outputPath, pathsToCreate, this.#ignores, this.configs, () => this.#siteCreationStatus != SiteCreationStatus.ONGOING);
+            this.#alteredPaths = [];
         }
         catch (err) {
             log(`Failed to create site!\n${err.stack}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "host-mdx",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "A cli tool to create and serve a static html website from a given mdx directory",
   "main": "index.js",
   "type": "module",
@@ -20,12 +20,14 @@
   "dependencies": {
     "chokidar": "^5.0.0",
     "ignore": "^7.0.5",
+    "lodash": "^4.17.23",
     "lowlight": "^3.3.0",
     "mdx-bundler": "^10.1.1",
     "p-limit": "^7.3.0",
     "polka": "^0.5.2",
     "preact": "^10.28.2",
     "preact-render-to-string": "^6.6.5",
+    "precinct": "^12.2.0",
     "rehype-highlight": "^7.0.2",
     "sirv": "^3.0.2"
   },