3 ms·

I've started using ESM in a static website builder too [1]. It works, kinda. Problems that I encountered: To get `__dirname`, you have to do an awkward workar

I've started using ESM in a static website builder too [1]. It works, kinda. Problems that I encountered: To get `__dirname`, you have to do an awkward workaround using path and url [3]. For npm modules that implement a path e.g. `@lib/method`, the import of this currently isn't allowed in node without a flag. For ESM incompatible modules, a createRequire [2] function is available to get the old `require` syntax. For import statements, the cache cannot be deleted yet [4]. Overall, I'm please to see that nodejs will soon be ESM compatible. All changes that have been made look reasonable and useful to me. In fact, I now often get the pleasurable "wow that makes sense" feeling when using node. It has has great docs, nice new features like worker_threads and it's productive for me. I'm a fan! 1: https://github.com/TimDaub/kloi https://github.com/TimDaub/kloi 2: https://nodejs.org/api/module.html#module_module_createrequire_filename https://nodejs.org/api/module.html#module_module_createrequi... 3: https://stackoverflow.com/questions/46745014/alternative-for-dirname-in-node-when-using-the-experimental-modules-flag https://stackoverflow.com/questions/46745014/alternative-for... 4: https://github.com/nodejs/modules/issues/307 https://github.com/nodejs/modules/issues/307

madeofpalk 6y ago
> For npm modules that implement a path e.g. `@lib/method`, the import of this currently isn't allowed in node without a flag. FWIW, (and im sure you know this, just pointing it out for others) @lib/method is not a path - the @ at the beginning indicates the package is namespaced under an org. @lib/method is a full and proper regular package, whereas `lib/method` would be pointing to a path within the lib package.
cookiengineer 6y ago
If you decide to work with ESM there's only one issue I have with them in practice: There's no way to remap a "global package identifier" to the entry point (e.g. remap import from "package" to "../path/to/mymodules/package/index.mjs") on the Browser-side. Node.js has the workaround with the "exports{}" map in the package.json file, but there is no equivalent on the Browser-side, so you constantly have to work with dozens of "../../to/index.mjs" files as wrappers that do nothing more than a lot of "export * from ./some/other/file.mjs" inside them, which is a bit annoying. As a side note (most people aren't aware of it): All Browsers have support for ESM modules, including Safari; and even WebKit2GTK. [1] [1] https://caniuse.com/es6-module https://caniuse.com/es6-module
- Zardoz84 6y ago
  IE11 not
  - deleted 6y ago
    [deleted]
  - imbnwa 6y ago
    Dunno why this is downvoted, IE11 isn't going anywhere in some rather crucial places, like all healthcare
    - deleted 6y ago
      [deleted]
- timdaub 6y ago
  > There's no way to remap a "global package identifier" to the entry point (e.g. remap import from "package" to "../path/to/mymodules/package/index.mjs") on the Browser-side. I think what you're looking for is `require.resolve` [1]. ```mjs import { createRequire } from "module"; const require = createRequire(import.meta.url); const path = require.resolve("package"); console.log(path); >> ../path/to/mymodules/package/index.mjs ``` 1: https://nodejs.org/api/esm.html#esm_no_require_resolve https://nodejs.org/api/esm.html#esm_no_require_resolve
  - cookiengineer 6y ago
    I was talking about Browser-side, the cleaner node.js solution is to use the "exports{}" map in the package.json [1] that I mentioned before. Personally, I wouldn't recommend to override the require.resolve or import.meta.resolve algorithm, as this is heavily experimental. [1] https://nodejs.org/api/packages.html#packages_exports https://nodejs.org/api/packages.html#packages_exports
- reaktivo 6y ago
  I'm hoping for the import-map[1] spec to supported soon. 1 https://blog.logrocket.com/es-modules-in-browsers-with-import-maps/ https://blog.logrocket.com/es-modules-in-browsers-with-impor...
deleted 6y ago
[deleted]

madeofpalk 6y ago

> For npm modules that implement a path e.g. `@lib/method`, the import of this currently isn't allowed in node without a flag. FWIW, (and im sure you know this, just pointing it out for others) @lib/method is not a path - the @ at the beginning indicates the package is namespaced under an org. @lib/method is a full and proper regular package, whereas `lib/method` would be pointing to a path within the lib package.

cookiengineer 6y ago

If you decide to work with ESM there's only one issue I have with them in practice: There's no way to remap a "global package identifier" to the entry point (e.g. remap import from "package" to "../path/to/mymodules/package/index.mjs") on the Browser-side. Node.js has the workaround with the "exports{}" map in the package.json file, but there is no equivalent on the Browser-side, so you constantly have to work with dozens of "../../to/index.mjs" files as wrappers that do nothing more than a lot of "export * from ./some/other/file.mjs" inside them, which is a bit annoying. As a side note (most people aren't aware of it): All Browsers have support for ESM modules, including Safari; and even WebKit2GTK. [1] [1] https://caniuse.com/es6-module https://caniuse.com/es6-module

Zardoz84 6y ago
IE11 not
- deleted 6y ago
  [deleted]
- imbnwa 6y ago
  Dunno why this is downvoted, IE11 isn't going anywhere in some rather crucial places, like all healthcare
  - deleted 6y ago
    [deleted]
timdaub 6y ago
> There's no way to remap a "global package identifier" to the entry point (e.g. remap import from "package" to "../path/to/mymodules/package/index.mjs") on the Browser-side. I think what you're looking for is `require.resolve` [1]. ```mjs import { createRequire } from "module"; const require = createRequire(import.meta.url); const path = require.resolve("package"); console.log(path); >> ../path/to/mymodules/package/index.mjs ``` 1: https://nodejs.org/api/esm.html#esm_no_require_resolve https://nodejs.org/api/esm.html#esm_no_require_resolve
- cookiengineer 6y ago
  I was talking about Browser-side, the cleaner node.js solution is to use the "exports{}" map in the package.json [1] that I mentioned before. Personally, I wouldn't recommend to override the require.resolve or import.meta.resolve algorithm, as this is heavily experimental. [1] https://nodejs.org/api/packages.html#packages_exports https://nodejs.org/api/packages.html#packages_exports
reaktivo 6y ago
I'm hoping for the import-map[1] spec to supported soon. 1 https://blog.logrocket.com/es-modules-in-browsers-with-import-maps/ https://blog.logrocket.com/es-modules-in-browsers-with-impor...

deleted 6y ago

[deleted]