parcel-bundler / parcel

The zero configuration build tool for the web. πŸ“¦πŸš€
https://parceljs.org
MIT License
43.43k stars 2.26k forks source link

Cannot import react-bootstrap-typeahead #9350

Closed gagdiez closed 11 months ago

gagdiez commented 11 months ago

πŸ› bug report

Parcel is failing to load the react-bootstrap-typeahead component, failing with the error: TypeError: Cannot read properties of undefined (reading 'default')

πŸŽ› Configuration (.babelrc, package.json, cli command)

see repository bellow

{
  "name": "my-near-app",
  "version": "1.0.0",
  "license": "(MIT AND Apache-2.0)",
  "type": "module",
  "scripts": {
    "start": "parcel index.html"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-bootstrap-typeahead": "6.3.1",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "parcel": "^2.10.1",
    "process": "^0.11.10"
  }
}

minimal repo to reproduce error here: https://github.com/gagdiez/rbt-error-minimal

πŸ€” Expected Behavior

The library should load and no error be displayed

😯 Current Behavior

hasOwnProperty
node_modules/.pnpm/react-bootstrap-typeahead@6.3.1_react-dom@18.2.0_react@18.2.0/node_modules/react-bootstrap-typeahead/es/utils/index.js:17
  14 | export { default as getStringLabelKey } from './getStringLabelKey';
  15 | export { default as getTruncatedOptions } from './getTruncatedOptions';
  16 | export { default as getUpdatedActiveIndex } from './getUpdatedActiveIndex';
> 17 | export { default as hasOwnProperty } from './hasOwnProperty';
  18 | export { default as isSelectable } from './isSelectable';
  19 | export { default as isShown } from './isShown';
  20 | export * from './nodash';
View compiled
(anonymous function)
node_modules/.pnpm/@parcel+transformer-js@2.10.1_@parcel+core@2.10.1/node_modules/@parcel/transformer-js/src/esmodule-helpers.js:11:58
   8 | 
   9 | exports.exportAll = function (source, dest) {
  10 |   Object.keys(source).forEach(function (key) {
> 11 |     if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
     |                                                          ^  12 |       return;
  13 |     }
  14 | 

πŸ”¦ Context

Trying to build an application that uses that Component

πŸ’» Code Sample

minimal repo to reproduce error here: https://github.com/gagdiez/rbt-error-minimal

🌍 Your Environment

Software Version(s)
Parcel 2.10.1
Node 18.16.0
npm/Yarn yarn 1.22.19
Operating System MacOS Latest stable
ericgio commented 11 months ago

React-Bootstrap-Typeahead has a helper function called hasOwnProperty. I believe what's happening is that Parcel's esmodule-helpers are trying to call that rather than Object.prototype.hasOwnProperty.

Suggested fix is to call the prototype function directly, which is safer:

Object.prototype.hasOwnProperty.call(dest, key)
gagdiez commented 11 months ago

can confirm that @ericgio suggestion works, will see to contribute it except if @ericgio prefers to do it (since it was their finding).