Alternative for customResolveOptions.extensions #1026

[paladox]

Hi, i'm wondering what the alternative for:

    customResolveOptions: {
      // By default, it tries to use page.mjs file instead of page.js
      // when importing 'page/page'.
      extensions: ['.js'],
      moduleDirectory: 'external/ui_npm/node_modules',
    }

is?

Because currently i see that customResolveOptions is converted to moduleDirectories but .extensions isn't. So currently things are failing to compile with:

[es-dev-server] node-resolve:  Error: Could not resolve import "lit/decorators" in /home/jenkins/.cache/bazel/_bazel_jenkins/67bba20af71044f1eb598ecb44098f26/execroot/gerrit/bazel-out/k8-fastbuild/bin/polygerrit-ui/karma_test.runfiles/gerrit/polygerrit-ui/app/_pg_with_tests_out/elements/admin/gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.js using exports defined in /home/jenkins/.cache/bazel/_bazel_jenkins/67bba20af71044f1eb598ecb44098f26/execroot/gerrit/bazel-out/k8-fastbuild/bin/polygerrit-ui/karma_test.runfiles/gerrit/external/ui_npm/node_modules/lit/package.json.
    at resolvePackageImportsExports (/home/jenkins/workspace/Gerrit-verifier-chrome-latest/gerrit/polygerrit-ui/node_modules/@rollup/plugin-node-resolve/dist/cjs/index.js:474:9)
    at resolvePackageExports (/home/jenkins/workspace/Gerrit-verifier-chrome-latest/gerrit/polygerrit-ui/node_modules/@rollup/plugin-node-resolve/dist/cjs/index.js:501:33)
    at resolveId (/home/jenkins/workspace/Gerrit-verifier-chrome-latest/gerrit/polygerrit-ui/node_modules/@rollup/plugin-node-resolve/dist/cjs/index.js:672:45)

Our rollup config: https://github.com/GerritCodeReview/gerrit/blob/master/polygerrit-ui/app/rollup.config.js

Using version 10 works but 11+ doesn't.

[paladox]

Ok i can see why it's failing, for some reason it's not appending the .js prefix to imports that doesn't contain it. I'm not sure why or how to fix that.

[potatohoney-p]

There are two separate changes here:

1. extensions is a top-level node-resolve option, rather than a member of customResolveOptions:

nodeResolve({ extensions: ['.js'] })

2. That option does not append .js to a package subpath when matching its exports map. For the error shown, the import must match the subpath that Lit actually exports:

// Not exported by the Lit version tested below:
import { customElement } from 'lit/decorators';

// Exported:
import { customElement } from 'lit/decorators.js';

I checked this with Lit 2.2.5, Rollup 2.77.2, and node-resolve 13.3.0. Lit's package.json has an export for ./decorators.js, but none for ./decorators. Even with extensions: ['.js'], the extensionless import produces the same “using exports defined in …/lit/package.json” warning and remains an unresolved external in the generated bundle. Changing only the import to lit/decorators.js produces a bundle with no warnings and no external imports.

With node-resolve 10.0.0 and the old customResolveOptions.extensions configuration, the extensionless import bundles successfully. The v11 changelog records both removal of customResolveOptions and introduction of package entry-point support, which explains why migrating the option alone does not restore the old behavior.

The search location is a separate setting too: moduleDirectories is for directory names to search recursively; modulePaths is for additional absolute paths. Neither changes which subpaths a package exports. See the node-resolve options.

This is an isolated resolution/bundling reproduction, not a verification of Gerrit's Bazel/es-dev-server setup or the application in a browser. Check the installed Lit version's exports if it differs from 2.2.5; the particular subpath must be exported by that version.