director

library1.2.0jsnpmunverified

This library, Director Router, provides a routing solution for both client-side (browser) and server-side (Node.js HTTP and CLI) JavaScript applications. It is dependency-free, aiming for minimal differences in usage across environments. Key features include hash-based client-side routing, and traditional path-based routing for Node.js servers and command-line interfaces. The package's current stable version is 1.2.8, released nearly a decade ago. It primarily focuses on hash-based routing for the browser and traditional URL path matching for servers, predating widespread adoption of the HTML5 History API for client-side routing. Its release cadence is effectively stalled, with no updates in many years, making it unsuitable for new projects due to a lack of maintenance and modern feature support.

web-framework

npm install director

github ↗package ↗

INSTALL

IMPORT

SIG · DIRECTOR

director

web-frameworkjavascriptv1.2.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

Router

✓ const Router = require('director');

✗ import Router from 'director';

For Node.js environments, Director is primarily used via CommonJS `require()`. It does not officially support ESM, and direct ESM imports will likely fail without a transpilation step.

Router (browser global)

✓ <script src="path/to/director.min.js"></script> <script> var router = Router(routes); </script>

When included via a script tag in the browser, Director exposes the `Router` constructor as a global variable. This can lead to naming collisions with other libraries.

Demonstrates basic client-side hash-based routing in an HTML file using Director, logging route events to the console.

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Director Client-Side Routing Example</title> <script src="https://rawgit.com/flatiron/director/master/build/director.min.js"></script> <script> var author = function () { console.log("Route: author"); }; var books = function () { console.log("Route: books"); }; var viewBook = function (bookId) { console.log("Route: viewBook, ID: " + bookId); }; var routes = { '/author': author, '/books': [books, function() { console.log("Route: An inline handler for books."); }], '/books/view/:bookId': viewBook }; var router = Router(routes); router.init(); console.log('Router initialized. Click links to test hash-based routing.'); </script> </head> <body> <h1>Director Client-Side Router</h1> <ul> <li><a href="#/author">#/author</a></li> <li><a href="#/books">#/books</a></li> <li><a href="#/books/view/123">#/books/view/123</a></li> <li><a href="#/books/view/456">#/books/view/456</a></li> </ul> <p>Check the console for route handler output.</p> </body> </html>

Debug

Known issues

deprecatedThe `director` package is abandoned and has not been updated in nearly a decade. Its dependencies are outdated, and it lacks modern features like official ESM support or the HTML5 History API. It is not recommended for new projects.

fix

Migrate to a actively maintained routing library like `react-router`, `vue-router`, or `express` (for server-side).

affects: >=1.2.8

deprecatedThe provided quickstart examples use `rawgit.com` for CDN delivery, which has been deprecated since 2019. Directly linking to GitHub raw files for production is also a security risk and unreliable.

fix

Do not use `rawgit.com` or direct GitHub raw links. For testing, download the script locally or use a proper CDN if one were available (which is not the case for Director).

affects: *

gotchaDirector primarily relies on hash-based routing (`#/path`) for client-side applications. It does not natively support the HTML5 History API (`pushState`, `replaceState`), which is the standard for modern single-page applications.

fix

If History API support is crucial, you will need to implement a custom solution or choose a different routing library. Director's core design is centered on hash-routing.

affects: *

gotchaIn browser environments, Director exposes the `Router` constructor as a global variable. This can lead to naming collisions if other scripts on the page also define a global `Router`.

fix

Ensure `director.min.js` is loaded after any potential conflicting libraries, or rename the global `Router` if possible (which Director does not explicitly support out-of-the-box, making it a design limitation).

affects: *

Errors

Common errors & fixes

ReferenceError: Router is not defined

The Director library script (`director.min.js`) was not loaded correctly in the browser, or `Router` is being accessed before it's available.

fix

Ensure the `<script>` tag for `director.min.js` is present and correctly linked in your HTML, and that your application code accessing `Router` runs after the library has loaded.

TypeError: Router is not a function

In a Node.js environment, the `director` package was imported incorrectly, or `require('director')` did not return the `Router` constructor as expected.

fix

Use `const Router = require('director');` for CommonJS imports in Node.js. Avoid destructuring if `Router` is the default export, or attempting ESM `import` statements.

Error: Route '/my/missing/path' not found

The requested URL path does not match any of the routes defined in the router's configuration.

fix

Verify that the URL path being accessed exactly matches a defined route pattern, including any parameters. Ensure the router is initialized and listening for changes (e.g., `router.init()`).

Upgrade

Version history

1.2.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

5 hits · last 30 days

node

Resources

githubhttps://github.com/flatiron/director ↗

packagehttps://www.npmjs.com/package/director ↗