Allow directories in exports field of package.json

[zerkalica]

Node.JS (> 12) allows directories in exports, this works:

  "exports": {
    "./": "./dist/"
  },

But webpack 5 allows only file aliases

  "exports": {
    "./some": "./-/some.js"
  },

PS: Demo https://github.com/zerkalica/wp-exports-dir-bug

1. Clone, yarn install
2. cd lib/b
3. yarn build

Actual: Module not found: Error: Can't resolve '@some/lib-a/a' in '.../wp-exports-dir-bug/lib/b/-'
Expecteed: no errors

To demonstrate, that node works, uncomment '@some/lib-a/a': require.resolve('@some/lib-a/a') in lib/b/webpack.config.js
Actual and expected: no errors

[alexander-akait]

/cc @vankop

[sokra]

This should work. Could you provide a repro?

[zerkalica]

Demo added

[alexander-akait]

@zerkalica exports works only for ESM

[zerkalica]

@evilebottnawi What do you mean? https://nodejs.org/api/packages.html#packages_package_entry_points

If both "exports" and "main" are defined, the "exports" field takes precedence over "main". "exports" are not specific to ES modules or CommonJS

[alexander-akait]

@zerkalica Can you reproduce this without ts?

[zerkalica]

I include ts build into git repository, you can run yarn build:wp in lib/b to run without tsc.

[alexander-akait]

@vankop @sokra It looks like we are not applying extensions on exports fields (AppendPlugin)

[alexander-akait]

@zerkalica Why do you use import without extension?

[sokra]

@vankop @sokra It looks like we are not applying extensions on exports fields (AppendPlugin)

Yep and as far as I know this is correct this way. Extension need to be included in the request.

[zerkalica]

Using exports != using esm. Extensions doesn't required in commonjs require, only in imports (https://nodejs.org/api/esm.html#esm_mandatory_file_extensions) . Typescript imports are not 100% valid es imports, there is no consensus on what should be done, but ts produces valid cjs to webpack.

[alexander-akait]

@zerkalica yep, I known, just for information

[zerkalica]

@evilebottnawi Our infrastructure not ready or it, legacy code with lot of index.ts/js files in subdirectories. a/b needs to be rewrited to a/b/index.js. Ide's, which use ts language services (vscode), doesn't autocomplete es-imports correctly.

[jaydenseric]

This issue needs to be triaged and prioritized. I don't use webpack v5 myself yet but I'm getting reports people are unable to use Webpack v5 to bundle apollo-upload-client (~700k weekly installs), and presumably an increasing list of other packages that depend on standard Node.js resolution behavior regarding package exports.

• Can't compile in Webpack 5 jaydenseric/apollo-upload-client#231 (comment)
• Webpack 5 support jaydenseric/extract-files#15 (comment)

It's perfectly valid for a CJS module to require with an extensionless require path another CJS module in a directory that's wholly exposed via the other package's exports field. Node.js can resolve it just fine, and webpack is expected to be to be able to resolve anything Node.js can:

Recalling off my head some other packages with a similar pattern that webpack v5 presumably won't bundle correctly:

• https://unpkg.com/browse/graphql-react@12.0.0/universal/private/graphqlFetchOptions.js does require('extract-files/public/extractFiles').
• https://unpkg.com/next-graphql-react@8.0.2/universal/withGraphQLApp.js does require('graphql-react/universal/GraphQL').

[alexander-akait]

/cc @vankop maybe you can help with this?

[sokra]

Working on that