react-clock/dist/Clock.css could not be found within the project or in these directories: node_modules

[coling-git]

I am trying to add a TimePicker to my app and all I did was follow these three steps:

1. Install by executing npm install react-time-picker
2. Import by adding import TimePicker from 'react-time-picker'.
3. Use by adding <TimePicker /. Use onChange prop for getting new values.

The code crashes (on Android and iOS) at the "import TimePicker from 'react-time-picker'" with the error message:

error: Error: Unable to resolve module react-clock/dist/Clock.css from ./node_modules/react-time-picker/dist/entry.js: react-clock/dist/Clock.css could not be found within the project or in these directories:
node_modules

I checked and both of the files entry.js and Clock.css are in the correct places: node_modules/react-time-picker/dist/entry.js and node_modules/react-clock/dist/Clock.css

What could be causing this error??

[wojtekmaj]

What are you using to bundle your app? Can you share the config?

[ivdma]

The same issue happened to us in the (private) component library running Styleguidist (on Webpack).
To us, the fix was to add react-clock to the CSS resolve rule. Something similar to this:

module.exports = {
  module: {
    rules: [
      // ...
      {
        test: /\.css$/,
        include: [
          // ...
          path.resolve(__dirname, 'node_modules/react-clock'),
          // ...
        ],
        // ...
      },
    },
  },
},

[github-actions]

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this issue will be closed in 14 days.

[github-actions]

This issue was closed because it has been stalled for 14 days with no activity.