optimizeDeps throws Error: 'default' is not exported

[mgburns]

I'm attempting to use the experimental optimizeDeps feature to bundle dependencies.

Here's the relevant excerpt from my package.json:

  "dependencies": {
    "@use-it/event-listener": "^0.1.7",
    "classnames": "^2.3.1",
    "lodash": "^4.17.21"
  }

Here's my rollup.config.js:

import esbuild from "rollup-plugin-esbuild";
import dts from "rollup-plugin-dts";
import postcss from "rollup-plugin-postcss";

import pkgJson from './package.json';

/**
 * @type {import('rollup').RollupOptions}
 */
export default [
  {
    input: "src/index.ts",
    output: [
      {
        dir: "dist",
        entryFileNames: "cjs/[name].js",
        format: "cjs",
        sourcemap: process.env.NODE_ENV === "production",
      },
      {
        dir: "dist",
        format: "esm",
        sourcemap: process.env.NODE_ENV === "production",
        preserveModules: true,
        preserveModulesRoot: "src",
      },
    ],
    external: Object.keys(pkgJson.peerDependencies),
    plugins: [
      postcss({
        extract: true,
        to: "dist/index.css",
        minimize: process.env.NODE_ENV === "production",
        use: ["sass"],
      }),

      esbuild({
        minify: process.env.NODE_ENV === "production",
        optimizeDeps: {
          include: Object.keys(pkgJson.dependencies),
        }
      }),
    ],
  },
  {
    input: "src/index.ts",
    output: {
      file: "dist/index.d.ts",
      format: "es",
    },
    external: [/\.(s)css/],
    plugins: [dts()],
  },
];

And here are some errors it's throwing:

# Unable to detect the `module` entry point from [@use-it/event-listener](https://www.npmjs.com/package/@use-it/event-listener)
$ rollup -c rollup.config.js

[!] Error: 'default' is not exported by node_modules/.optimize_deps/@use-it/event-listener.js, imported by src/components/site-grid/site-grid.tsx
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
src/components/site-grid/site-grid.tsx (2:7)
1: import { useState } from "react";
2: import useEventListener from "@use-it/event-listener";

# Unable to destructure the `range` module from [lodash](https://www.npmjs.com/package/lodash)
$ rollup -c rollup.config.js
[!] Error: 'range' is not exported by node_modules/.optimize_deps/lodash.js, imported by src/components/site-grid/site-grid.tsx
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
src/components/site-grid/site-grid.tsx (3:9)
1: import { useState } from "react";
2: import useEventListener from "@use-it/event-listener";
3: import { range } from "lodash";

Not sure if this is a bug, a feature that hasn't been implemented, or user error. Thanks!

[fantasy525]

same error