fix(web): use proper node_modules directory (#623)

* fix(web): use proper node_modules directory

* fixup!

Author: avivkeller

src/generators/web/constants.mjs

@@ -1,8 +1,17 @@
+import { findPackageJSON } from 'node:module';
 import { resolve, dirname } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
 export const ROOT = dirname(fileURLToPath(import.meta.url));
 
+// Resolve node_modules relative to this package (doc-kit), not cwd.
+// We do this by finding where one of our dependencies (preact) is stored,
+// and using it's NODE_MODULES
+export const NODE_MODULES = resolve(
+  findPackageJSON(new URL(import.meta.resolve('preact'))),
+  '../..'
+);
+
 /**
  * @typedef {Object} JSXImportConfig
  * @property {string} name - The name of the component to be imported.

src/generators/web/utils/bundle.mjs

@@ -1,18 +1,10 @@
-import { join } from 'node:path';
-
 import virtual from '@rollup/plugin-virtual';
 import { build } from 'rolldown';
 
 import cssLoader from './css.mjs';
 import getStaticData from './data.mjs';
 import getConfig from '../../../utils/configuration/index.mjs';
-
-// Resolve node_modules relative to this package (doc-kit), not cwd.
-// This ensures modules are found when running from external directories.
-const DOC_KIT_NODE_MODULES = join(
-  import.meta.dirname,
-  '../../../../node_modules'
-);
+import { NODE_MODULES } from '../constants.mjs';
 
 /**
  * Asynchronously bundles JavaScript source code (and its CSS imports),
@@ -99,9 +91,8 @@ export default async function bundleCode(codeMap, { server = false } = {}) {
       },
 
       // Tell the bundler where to find node_modules.
-      // This ensures packages are found when running doc-kit from external directories
-      // (e.g., running from the node repository via tools/doc/node_modules/.bin/doc-kit).
-      modules: [DOC_KIT_NODE_MODULES, 'node_modules'],
+      // We use our custom `NODE_MODULES`, and then the cwd's `node_modules`.
+      modules: [NODE_MODULES, 'node_modules'],
     },
 
     // Array of plugins to apply during the build.