Closed Rutger-Knijnenburg closed 7 months ago
Hello !
I can't help without any codesandbox reproduction.. Sorry :/
@viclafouch I can't promise this is functional, since I can't test that it works via my yarn build
, but I can share code:
const [inputs, setInputs] = useState({
. . .
"inputColor": "#f0f0f688", /* testing if this works */
. . .
});
<FormLabel htmlFor="input-color">Input Color:</FormLabel>
<MuiColorInput
style={{ "width": "75%", "alignSelf": "center" }}
aria-label="Input Color" name="Input Color"
value={inputs['inputColor']}
onChange={handleChange}
/>
If I comment this out for my project, & then build, this error goes away:
ERROR in ./src/components/InputForm/InputForm.tsx 79:24-50 # <-- line & column are misleading and wrong here, ignore
Module not found: Error: Default condition should be last one # <-- this might be something that typescript cares about? Maybe?
@ ./src/components/App/App.tsx 30:18-63
@ ./src/index.tsx 9:12-45
webpack 5.90.0 compiled with 1 error in 44992 ms
error Command failed with exit code 1.
Just a react + typescript + mui project, using mui-color-input
version 2.0.2:
project> npm --version
10.4.0
project> yarn --version
1.22.10
project> node --version
v20.11.0
edit: if the package.json
sections help:
"scripts": {
"start": "react-scripts start",
"dev-server": "webpack --watch",
"lint": "eslint --fix ./src/**",
"build": "webpack",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"dependencies": {
"@emotion/react": "^11.11.3",
"@emotion/styled": "^11.11.0",
"@fontsource/roboto": "^5.0.8",
"@mui/icons-material": "^5.15.8",
"@mui/lab": "^5.0.0-alpha.164",
"@mui/material": "^5.15.7",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^14.1.2",
"@testing-library/user-event": "^13.5.0",
"@typescript-eslint/eslint-plugin": "^6.19.1",
"css-loader": "^6.9.1",
"eslint": "^8.56.0",
"eslint-config-standard-with-typescript": "^43.0.1",
"eslint-plugin-import": "^2.25.2",
"eslint-plugin-n": "^15.0.0",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-react": "^7.33.2",
"http-server": "^14.1.1",
"mui-color-input": "^2.0.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"svg-inline-loader": "^0.8.2",
"ts-loader": "^9.5.1",
"typescript": "*",
"web-vitals": "^2.1.4",
"webpack": "^5.90.0",
"yarn": "^1.22.21"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@typescript-eslint/parser": "^6.19.1",
"webpack-cli": "^5.1.4"
},
"peerDependencies": {
"react": "^17.0.0 || ^18.0.0",
"react-dom": "^17.0.0 || ^18.0.0"
}
Could you please try with the version 2.0.3 :)
@viclafouch Works like a charm ;) Sorry for the late response, and thanks for your fix!!
Describe the bug I'm trying to implement the sample code into my project, however even the sample code gives me a weird error.
To Reproduce Steps to reproduce the behavior:
Expected behavior No error of course ;)
Desktop (please complete the following information):
Additional context
This are my current dependencies. It might be something with versions or something? But I have no idea which one could be the issue. If I remove the Color picker code my project builds fine :)