How to correctly load local html-to-docx module?

[aaronkyle]

Hi Observable Community!

I am trying to load a module that I installed using npm install. The module exists undernode_modules/html-to-docx/ and has a folder called dist that contains 4 files:

• html-to-docx.esm.js,
• html-to-docx.esm.js.map
• html-to-docx.umd.js, and
• html-to-docx.umd.js.map.

Also there is a package.json in the top-level html-to-docx/ folder.

When I try import htmlToDocx from '../node_modules/html-to-docx/dist/html-to-docx.esm.js';, I get the error SyntaxError: non-local import: ../node_modules/html-to-docx/dist/html-to-docx.esm.js (1:0)

There is a folder at ./.observablehq/cache/_node/node_modules/html-to-docx/ but it is empty.

What is the correct way to import this module?

[mootari]

Please check if the import docs help to answer your question: https://observablehq.com/framework/imports#node-imports

[aaronkyle]

Thank you, @mootari - I started there.

For node imports, I tried just calling it first:

import * as htmlToDocx from 'html-to-docx'

I also tried the documentation of local imports, it gives 2 examples:

1. an example of where a variable is exported from a local file stored in the root directory.
2. using a file attachment

I tried to copy over the output in /dist from my node_modules directory into the /src/ folder and reference that. Could not make that work.

I have tried the the following import methods:

I am experimenting with a newly-created framework project, within which I installed fs and html-to-docx. These appear to be installed correctly, but there are no files in the /cache/_node directory.

[aaronkyle]

Gr. Looks like I was missing a trailing .js which threw me off for a long while. Typos.

Now having the umd.js file copied in to a /components/ folders under /src/, I am at least hitting the library. However I'm getting further errors, which I assume are related to a module dependency?

Is this a case where I need to learn esbuild?

[mootari]

I think that build is either broken or some dependencies (either direct or transitive) haven't been sufficiently constrained and are now incompatible. If you're determined enough you could try to clone the package's repo and get the example to run. If that works you'll at least have a baseline to work from.

[aaronkyle]

Thank you. Sounds like I have weekend homework 🤓