Unable to add react-widgets/ComboBox to project on Ubuntu - node.js

Question

I'm having a hard time deploying my app.
Using node 16.14.2 and npm 8.5.0.
My package versions are as follows:
{
"name": "tic-tac-toe",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "\^5.16.3",
"#testing-library/react": "\^12.1.4",
"#testing-library/user-event": "\^13.5.0",
"react": "\^18.0.0",
"react-dom": "\^18.0.0",
"react-scripts": "5.0.0",
"react-widgets": "\^5.8.4",
"web-vitals": "\^2.1.4"
},
I am able to get the issue simply by creating a default app (npx create-react-app my-app, adding import ComboBox from 'react-widgets/ComboBox'; to my index.js file, installing dependencies with npm install && npm install react-widgets, and running npm start.
The console output is as follows:
Failed to compile.
Module not found: Error: Can't resolve 'react-widgets/ComboBox' in '/home/twtduck/ttt/src'
assets by path static/ 1.62 MiB
asset static/js/bundle.js 1.61 MiB [emitted] (name: main) 1 related asset
asset static/js/node_modules_web-vitals_dist_web-vitals_js.chunk.js 6.91 KiB [emitted] 1 related asset
asset static/media/logo.6ce24c58023cc2f8fd88fe9d219db6c6.svg 2.57 KiB [emitted] (auxiliary name: main)
asset index.html 1.67 KiB [emitted]
asset asset-manifest.json 546 bytes [emitted]
runtime modules 31.7 KiB 16 modules
modules by path ./node_modules/ 1.48 MiB 96 modules
modules by path ./src/ 18.1 KiB
modules by path ./src/*.css 8.82 KiB
./src/index.css 2.72 KiB [built] [code generated]
./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css 1.37 KiB [built] [cod
e generated]
./src/App.css 2.72 KiB [built] [code generated]
./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/App.css 2 KiB [built] [code gen
erated]
modules by path ./src/*.js 5.71 KiB
./src/index.js 1.83 KiB [built] [code generated]
./src/App.js 2.49 KiB [built] [code generated]
./src/reportWebVitals.js 1.39 KiB [built] [code generated]
./src/logo.svg 3.61 KiB [built] [code generated]
WARNING in src/index.js
Line 7:8: 'ComboBox' is defined but never used no-unused-vars
ERROR in ./src/index.js 9:0-46
Module not found: Error: Can't resolve 'react-widgets/ComboBox' in '/home/twtduck/ttt/src'
resolve 'react-widgets/ComboBox' in '/home/twtduck/ttt/src'
Parsed request is a module
using description file: /home/twtduck/ttt/package.json (relative path: ./src)
Field 'browser' doesn't contain a valid alias configuration
resolve as module
/home/twtduck/ttt/src/node_modules doesn't exist or is not a directory
looking for modules in /home/twtduck/ttt/node_modules
existing directory /home/twtduck/ttt/node_modules/react-widgets
using description file: /home/twtduck/ttt/node_modules/react-widgets/package.json (relative path: .)
using description file: /home/twtduck/ttt/node_modules/react-widgets/package.json (relative path: ./ComboBox)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox doesn't exist
.web.mjs
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.mjs doesn't exist
.mjs
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.mjs doesn't exist
.web.js
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.js doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.json doesn't exist
.web.jsx
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.jsx doesn't exist
.jsx
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.jsx doesn't exist
as directory
/home/twtduck/ttt/node_modules/react-widgets/ComboBox doesn't exist
/home/twtduck/node_modules doesn't exist or is not a directory
/home/node_modules doesn't exist or is not a directory
/node_modules doesn't exist or is not a directory
looking for modules in /home/twtduck/ttt/node_modules
existing directory /home/twtduck/ttt/node_modules/react-widgets
using description file: /home/twtduck/ttt/node_modules/react-widgets/package.json (relative path: .)
using description file: /home/twtduck/ttt/node_modules/react-widgets/package.json (relative path: ./ComboBox)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox doesn't exist
.web.mjs
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.mjs doesn't exist
.mjs
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.mjs doesn't exist
.web.js
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.js doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.json doesn't exist
.web.jsx
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.web.jsx doesn't exist
.jsx
Field 'browser' doesn't contain a valid alias configuration
/home/twtduck/ttt/node_modules/react-widgets/ComboBox.jsx doesn't exist
as directory
/home/twtduck/ttt/node_modules/react-widgets/ComboBox doesn't exist
The strange part about this is that it works fine on Windows, but not Ubuntu. I've tried re-installing the server from a fresh image, to no success. I've also tried downgrading to react 17, which also doesn't work. Suggestions?

Answer 1

woltjer
can you try with this?
import { ComboBox } from 'react-widgets'
with this way you will get a part of react-widgets
that is similar to:
import { useState, useContex } from 'react'