evanw / evanw/esbuild

Issue with hybrid module import when using cjs

Open
#2,976 5 comments 0 reactions 0 assignees View on GitHub
Dominant language
Go
Stars
40.1k
Forks
1.3k
PR merge metrics
No merged PRs in 30d

Description

I am building a module with **esbuild**. It uses `euberlog` as a dependency, which is an hybrid module providing both esm and cjs support.

In my code I therefore use:

```typescript
import logger from 'euberlog';
```

And then I compile it with esbuild:

```js
const shared = {
platform: 'node',
entryPoints: ['source/index.ts'],
bundle: true,
minify: true,
treeShaking: true,
sourcemap: true
};

build({
...shared,
outfile: 'bundled/lib/commonjs/index.js',
format: 'cjs',
external: getExternalDependencies()
});
```

It is actually built both for esm and cjs.
The problem is that if I import the cjs module somewhere, I have the error:

```
TypeError: i.default.info is not a function
```

and then if I patch the code and print `i`, I see that the result is:

```
{ default: { Logger: [Getter], default: [Getter] }, Logger: [Getter] }
```

It seems like that esbuild translates the first import (`import logger from 'euberlog'`) as `import * as logger from 'euberlog'`, but this does not make sense.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reproducing the CJS build from source/index.ts using the shown esbuild configuration, then inspect how the hybrid euberlog import appears in the generated output. Done means the resulting CJS module can use the default import and call logger.info without the reported TypeError.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
build-system, compilers
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.