I just installed mui, and found messages like this:
Compiled with problems:
ERROR in ./node_modules/#mui/material/AccordionActions/AccordionActions.js 7:0-70
Module not found: Error: Can't resolve '#mui/base' in 'C:\..\node_modules\#mui\material\AccordionActions'
By the way, I use yarn.
and at terminal i get
webpack compiled with 253 errors and 1
warning
and this my package.json dependencies:
"dependencies": {
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#mui/icons-material": "^5.8.2",
"#mui/material": "^5.8.2",
"#mui/styled-engine-sc": "^5.8.0",
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "5.3.0",
"react-scripts": "5.0.1",
"styled-components": "^5.3.5",
"web-vitals": "^2.1.4"
},
I've used yarn add #mui/base, but it's still like that, is there a workaround?
check out this links:
first one is official material UI and second npm
https://mui.com/base/getting-started/installation/
https://www.npmjs.com/package/#mui/base
simply install the mui base first .
if you are using npm then go with this command :
npm install #mui/base
if you are using yarn then go with this command :
yarn add #mui/base
Related
I have a typescirpt react project that i want to deploy to s3 with cloud front. i tried to use aws codepipeline to deploy my typescript react project to s3. i kept getting the following error in build stage:
2022/10/31 08:56:42 Running command npm run build
> web-frontend#0.1.0 build /codebuild/output/src017550065/src
> react-scripts build
/codebuild/output/src017550065/src/node_modules/eslint-webpack-plugin/node_modules/jest-worker/build/index.js:110
_ending;
^
SyntaxError: Unexpected token ;
here is my buildspec.yml file:
version: 0.2
phases:
install:
runtime-versions:
nodejs: latest
commands:
- npm install -g typescript
- npm install
build:
commands:
- npm run build
artifacts:
# include all files required to run application
# notably excluded is node_modules, as this will cause overwrite error on deploy
files:
- public/**/*
- src/**/*
- package.json
- appspec.yml
- scripts/**/*
cache:
paths:
- './node_modules/**/*'
my package.json file:
{
"name": "web-frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"#types/jest": "^27.5.2",
"#types/node": "^16.11.66",
"#types/react": "^18.0.21",
"#types/react-dom": "^18.0.6",
"bootstrap": "^5.2.2",
"dotenv": "^16.0.3",
"react": "^18.2.0",
"react-bootstrap": "^2.5.0",
"react-bootstrap-icons": "^1.9.1",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"typescript": "^4.8.4",
"web-vitals": "^2.1.4"
}
}
the line of code that throwing this error()
class Worker {
_ending;
_farm;
_options;
_workerPool;
i tried to edit the buildspec.yml file. change the jsnode version to 10,12 and latest.
I am trying to use react-icon FaStar in an app. I first created a component in a separate create-react-app and used FaStar successfully in that install. Then I transported the .js and .cs files to the create-react-app that I am developing.
After using npm install react-icon and I get
Attempted import error: 'FaStar' is not exported from 'react-icons/fa'.
When I look at node_modules/react-icon/fa/index.js all I see is
/ THIS FILE IS AUTO GENERATED
var GenIcon = require('../lib').GenIcon
In the installation where I developed the component, I see
Any idea why this is happening? Thanks
The solution for this problem was rebuilding the project create-react-app by installing react-icons before all the other dependencies. One must have been interfering(probably http-proxy-middleware) with react-icons install.
Here are the dependencies from package.json
"dependencies": {
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"axios": "^0.22.0",
"http-proxy-middleware": "^2.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-hot-loader": "^4.13.0",
"react-icons": "^4.3.1",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2"
},
I tried to update material ui following the instructions on their web site
from 3.9.3 to the latest version.
I ran npm install #material-ui/core and npm install react#latest
but I am getting the following error when I deploy my app:
hoist-non-react-statics.cjs.js:70 Uncaught TypeError: Cannot convert undefined or null to object
at getPrototypeOf (<anonymous>)
at e (hoist-non-react-statics.cjs.js:70)
at n (withTheme.js:47)
at Module.1038 (AppSettings.js:95)
at u (index.html:1)
at Object.620 (main.5ef97776.chunk.js:1)
at u (index.html:1)
at r (index.html:1)
at Array.t [as push] (index.html:1)
at main.5ef97776.chunk.js:1
These are the dependencies in my app:
"dependencies": {
"#date-io/core": "^1.3.8",
"#date-io/moment": "^1.3.11",
"#material-ui/core": "^4.11.4",
"#material-ui/icons": "^3.0.2",
"material-design-icons": "^3.0.1",
"material-ui-pickers": "^2.2.4",
"moment": "^2.24.0",
"react-app-polyfill": "^1.0.4",
"react-dates": "^16.7.1",
"react-dom": "^17.0.1",
"react-router-dom": "^4.3.1",
"react-scripts": "^3.3.0",
"react-select": "^3.0.8",
"core-js": "^2.6.12",
"flux": "^3.1.3",
"react": "^17.0.2",
},
Any help with this?
You need to update your package.json to use the latest version of Material-UI.
"dependencies": {
"#material-ui/core": "^4.0.0"
}
Replace version with the latest or desired version.
Run
npm install #material-ui/core
or
yarn add #material-ui/core
Follow this guide on the changes you have to make. Remember in open-source environments, upgrading a package from x.0.0 to y.0.0 is considered a major version upgrade and will contain breaking changes 99% of the time. Simply bump the version and do nothing will almost guarantee to break your code.
I am trying to use the CLI to create a project with Ionic and React. I noticed that the bug is in the Typescript checking step.
I've been trying the following things to solve it:
Remove the node_modules and the package-lock.json
npm cache clear --force
Downgrade the Typescript version to 3.3.3333 (Most of the users who had the same problem solve it with this)
npm i
ionic serve
But it keeps showing me the same prompt [react-scripts] Files successfully emitted, waiting for typecheck results...
Dependencies:
"#capacitor/core": "2.1.0",
"#ionic/react": "^5.0.7",
"#ionic/react-router": "^5.0.7",
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.4.0",
"#testing-library/user-event": "^8.0.3",
"#types/jest": "^24.0.25",
"#types/node": "^12.12.24",
"#types/react": "^16.9.17",
"#types/react-dom": "^16.9.4",
"#types/react-router": "^5.1.4",
"#types/react-router-dom": "^5.1.3",
"ionicons": "^5.0.0",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"react-scripts": "3.4.1",
"typescript": "3.3.3333"
What else can I do?
Downgrade to react-scripts 3.4.0
npm uninstall react-scripts -S
npm i react-scripts#3.4.0
ionic serve
Insights
If I open a tab with localhost:8100, it works (even the hot reload), but the ionic serve does not open a window by itself and the prompt in the terminal still the same
I'm trying to install node dependencies for my react project that i downloaded from source control but having some troubles.For instance I'm getting this error:
Failed to compile
./node_modules/chain-function/index.js
Error: ENOENT: no such file or directory, open 'C:\....\v7\ClientApp\node_modules\chain-function\index.js'
I do not have "chain-function" a listed as dependency in my package.json file, and i'm not sure how to figure out what is causing the error here and how to troubleshoot it.
here is my package.json dependencies:
"bootstrap": "^3.3.7",
"jquery": "^3.3.1",
"popper.js": "^1.14.4",
"react": "^16.5.2",
"react-bootstrap": "^0.31.5",
"react-cookie": "^3.0.4",
"react-dom": "^16.0.0",
"react-redux": "^5.0.7",
"react-router-bootstrap": "^0.24.4",
"react-router-dom": "^4.2.2",
"react-scripts": "^2.0.4",
"react-text-mask": "^5.4.3",
"react-tooltip": "^3.9.0",
"react-transition-group": "^2.5.0",
"redux": "^4.0.0",
"rimraf": "^2.6.2"
It's possible that some of your dependency in package.json rely on chain-function or it's just the problem with the network.It's normal to face a problem like this.I can only give you some advices.
delete your node_modules,run "npm install" again
download the project in another directory folder, and try it again
check your network