Can't be used with Next.js: Consider publishing non ESM modules: is a nightmare to setup and make it work!

[stevemarksd]

I have to add this util

exports.importEsm = function(file) {
  return import(file);
}

Then when I want to use it:

const {importEsm} = require( './import-esm.js');

export const createFavicons = async () => {
  console.log({importESM: importEsm.toString()})
  // @ts-ignore
  const favicons = (await importEsm('favicons')).default;
  console.log({favicons})

Took me hours to figure out. In addition:

• ts-node must start with ts-node --esm

tsconfig needs:

  "compilerOptions": {
    "module": "commonjs",
    "target": "es2017",
    "esModuleInterop": true,
    "allowJs": false
},

  "ts-node": {"esm": true},
  "ignore": ["./server/import-esm.js"]

---

Also can't import types obviously this way. Maybe with import type?

---

In addition, using --esm will break next.js with this error: [Error: EPERM: operation not permitted, open \.next\trace.

---

New edit: the import-esm.js must also be manually copied in the build when run in production.. So much work to use this library.

Error: Cannot find module '../utils/tsimportlib'
Require stack:
-  \dist\....js
- ```

Please check the amount of time spent to make it work: https://github.com/TypeStrong/ts-node/discussions/1290

[andy128k]

See jantimon/favicons-webpack-plugin#291

just replace const favicons = require('favicons') by const { favicons } = await import('favicons').

[stevemarksd]

Thanks for the help, but after spending countless hours I fixed in 30 minutes (including creating a npm account).

I tried all kind of imports... but seems like magic. Maybe my lack of understanding of esm.

I ended up republishing with es5 and ts: https://www.npmjs.com/package/@esm-to-es5/favicons works out of the box with everything :) and no need to install @types.

[jameswilddev]

I'm also having a lot of trouble with this. A lot of tooling (e.g. e2e test runners) expects you to use either CJS or MJS, not a mix of the two, and as almost everything else on NPM is CJS, I therefore cannot use any MJS packages at this time.

[andy128k]

CJS is available since v7.0.0-beta.4