ESM package is invalid

Package.json mentions that this is an Node ES module:

css-selector-generator/package.json

Line 8 in d72f6ff

"type": "module",

But ESM requires file extensions, which are missing:

css-selector-generator/src/index.ts

Line 1 in d72f6ff

import {getFallbackSelector} from './selector-fallback'

Additionally, your . import actually point to the non-ESM version, so it's doubly-incorrect:

import "css-selector-generator"' fails because build/index.js not ESM at all
import "css-selector-generator/esm" fails because it's not a valid node ESM import

Little big note: To have file extensions you'll have to write .js in your TS imports, even if the file is actually .ts; That's TypeScript for you.

You might want to at-least-temporarily use this workflow to ensure that your module is importable from the tools you want to support:

https://github.com/fregante/ghatemplates/blob/main/esm-lint/esm-lint.yml

For reference, this is the error Webpack shows when importing /esm directly:

ERROR in ./node_modules/css-selector-generator/esm/index.js 5:0-49
Module not found: Error: Can't resolve './constants' in './node_modules/css-selector-generator/esm'
Did you mean 'constants.js'?
BREAKING CHANGE: The request './constants' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.

To resolve this quickly:

remove type: module

To resolve it properly:

good luck 😅
point export['.'] to the ESM file
create a build/package.json file with type: commonjs to override the root package.json

@fregante Thank you for reporting this. I'll look into it.

The esm-lint.yml is a neat idea. Thanks for the tip.

I think I got it!
https://github.com/fczbkk/css-selector-generator/actions/runs/2776836250

Great! Keep in mind that type: module is a Node setting, so if Node doesn't work (which it doesn't in your tests), then it should still be removed.

@fregante I'm not sure I understand. Why is the "type": "module" a problem?

Node is telling you here: https://github.com/fczbkk/css-selector-generator/runs/7599538534?check_suite_focus=true

Node ES Modules must have extensions, but this package doesn't. The only reason why all the bundlers work is because of years of "compat" layers.

https://nodejs.org/dist/latest-v14.x/docs/api/esm.html#esm_mandatory_file_extensions

This package is specifying type: module without actually supporting type: module

I must really be missing something. The file extensions are there, the project and build is setup according to TS documentation:
https://www.typescriptlang.org/docs/handbook/esm-node.html

So if there's still something not working, then ¯\_(ツ)_/¯

Indeed I see the extensions in the latest build, but the ESM folder still contains require 😅

https://unpkg.com/browse/css-selector-generator@3.6.3/esm/index.js

If you re-enable the Node job in the import-lint it might tell you about more issues. At the very least this should throw the error "REQUIRE OF ESM FILE"

@fregante I have just released css-selector-generator@3.6.4 which should finally do the dual mode correctly. Fingers crossed. Please let me know if it works for you.

All the issues seems to have been fixed in the package 🎉
I'll let you know on the next update cycle 👍