Fail to import ESM dependencies in config file

[frandiox]

Do NOT ignore this template or your issue will have a very high chance to be closed without comment.

Describe the bug

Given the following config file:

// vite.config.js
import plugin from 'my-esm-plugin'
export default {
  plugins: [plugin]
}

Where my-esm-plugin is a dependency (in node_modules) that uses ESM ("type": "module" in package.json).

During config resolution, Rollup keeps node_modules as external dependencies due to this line ((id[0] !== '.' && !path.isAbsolute(id))). In this case, the file will be transpiled to something like:

const plugin = require('my-esm-plugin');
...

This is because it's treated as an external dependency (it would be bundled otherwise).
Then, since it's an ESM dependency but it uses require to import it, it will fail with [ERR_REQUIRE_ESM]: Must use import to load ES Module.

In order for this to work, node_modules should not be treated as external dependencies (by removing the mentioned line) and Rollup should use rollup-plugin-commonjs. However, I do not know if there is a drawback to this. Perhaps just performance?

I can make a PR if you are OK with these changes, or if you can propose something else.

System Info

• required vite version: rc.13
• required Operating System: macOS Catalina
• required Node version: 14.15.1

[aleclarson]

Have you tried playing with output.interop Rollup option?

http://rollupjs.org/guide/en/#outputinterop

[frandiox]

@aleclarson I tried for a while but couldn't make it work. Since it's treated as an external dependency, I think Rollup is not even using the interop option. Not sure about this though.
My current workaround is providing the plugin in commonJS with .cjs extension.

[akauppi]

@frandiox Have you noticed there's now 2.0 betas available.

[yyx990803]

2.0 properly handles esm configs in type: 'module' projects. If the issue persists, please open a new issue with proper reproduction.