Doesn't work in "without a build step workflow"

[mahmoudelbadrywork]

Hello, First Thanks for your work on Preact and Preact Router Second I'm having a problem using the preact-router.module.js as is from the dist folder in an ES Modules project that uses eleventy to copy the files from node_modules to another directory so When I import the Router using the following line

import { Router } from "./preact-router.module.js";

it gives me the following error in the console:

Uncaught TypeError: Error resolving module specifier “preact”. Relative module specifiers must start with “./”, “../” or “/”.

This is due to the following line in the preact-router.module.js file:

import{createContext as n,Component as t,toChildArray as r,cloneElement as i,h as o}from"preact";import{useContext as e,useState as u,useEffect as f}from"preact/hooks";

Is there something I'm missing here to use the ES Module as is without any modification or build step

[rschristian]

Second I'm having a problem using the preact-router.module.js as is from the dist folder in an ES Modules project that uses eleventy to copy the files from node_modules to another directory

This is not a viable way to use any library with dependencies, unfortunately. Libraries distributed upon NPM do so knowing they can take advantage of the module resolution mechanisms that are built into all modern platforms. This makes them unsuitable for the web.

You'll either want to rebundle your deps yourself (to remove the need for module specifiers altogether) or use one of the many CDNs that have this figured out already. Usually they end up rewriting specifiers, so import ... from 'preact' becomes import ... from 'https://example-cdn.com/preact'.

[foxt]

You will need to change import xyz from "package" to import xyz from "./package.js" For example, my router.js file looks like this