Understanding packages and require

Hi All,

I’ve just finished and published my first npm package. My intention is to be able to require it from Observable. I’m pretty new to the whole package business and find it hard to get my head round the whole thing. Unsurprisingly, my package is not yet set up properly to be required from Observable, but it does run correctly in Node.

Could anyone point me towards a good tutorial on this, or a template package that I can crib my package.json from, given what I’m trying to achieve? I find the whole build/transpile bit confusing, so I’m not sure I’m anywhere close with my configuration, despite having read quite a few tutorials.

Thank you!

Stu

Not an answer to your question (sorry), but there seems to be a typo in your package.json:

"module": "dist/moudle.js"

That file also doesn’t exist in the published package. I’m guessing that this is what’s breaking bundling services (like esm.sh and skypack).

Thanks, that’s a good start! :man_facepalming:

I’ve updated my package.json. I’m building using Parcel but I think I had it incorrectly configured, in that my option to build a module was being ignored. I believe I’ve corrected this.

However, I still have no joy importing: unpkg shows that there is a dist/module.js file though.

Any thoughts?

That’s to be expected, I think. Afaik unpkg isn’t a bundler, but will only rewrite import paths. Your d3 import would have to be bundled with your package.

esm.sh works though:

model = (await import('https://esm.sh/micro-table')).model

(You may want to make .model your default export.)

Interestingly, importing via skypack

import('https://cdn.skypack.dev/micro-table')

fails with the error

Error: [Package Error] "d3@v7.7.0" could not be built. (Imported by "micro-table").

But it appears that they have some server troubles - their search is broken as well.

Anyway, recommending your users to import via a 3rd party service like esm.sh is perfectly fine, in my opinion. Many popular packages do it, and it will let you focus your time and resources on more important things.

This is really helpful; thank you.

I agree that esm.sh seems like a satisfactory solution, and will allow me to get going and focus on the functionality rather than the mechanics.

2 Likes

p.s., is it worth adding esm.sh as an import method (or a suggestion of something to try) to the module require debugger?

It’s already listed in this comment, but we’ll probably not make any changes to the notebook in the near future.

If you feel strongly about it, you could fork the notebook and submit a suggestion. :slight_smile:

1 Like

OK thanks. :slightly_smiling_face: