Closed xAgustin93 closed 2 years ago
Getting the same error.
Webpack 5.65.0 Node 16.13.1 NPM 8.1.2
The error is likely to caused by double semicolons in semantic.min.css
Temporary (but not quite good) solution: add sed -i 's/;;/;/g' node_modules/semantic-ui-css/semantic.min.css &&
in front of your start/build script in package.json
sed -i 's/;;/;/g' node_modules/semantic-ui-css/semantic.min.css
This solution generates an error.
➜ app git:(master) ✗ yarn start
yarn run v1.22.13
$ sed -i 's/;;/;/g' ./node_modules/semantic-ui-css/semantic.min.css && react-scripts start
sed: 1: "./node_modules/semantic ...": invalid command code .
error Command failed with exit code 1.
Getting same error. 🥲🥲
same error here :(
i'm using hamerin's temporary solution like this. (it can be used irrespective of the OS - mac OS or Linux)
CHECK_OS="`uname -s`"
if [[ "$CHECK_OS" = "Darwin" ]]; then
sed -i '' 's/;;/;/g' node_modules/semantic-ui-css/semantic.min.css
sed -i '' 's/;;/;/g' node_modules/semantic-ui-css/semantic.css
else
sed -i 's/;;/;/g' node_modules/semantic-ui-css/semantic.min.css
sed -i 's/;;/;/g' node_modules/semantic-ui-css/semantic.css
fi
"start": "./init.sh && react-scripts start",
"build": "./init.sh && GENERATE_SOURCEMAP=false react-scripts build",
same here.
with react-scripts 4.03
it is working fine, but I get the same error when upgrading react-scripts
to version 5
This issue is extremely annoying, to workaround it I created @semantic-ui-react/css-patch
, works with semantic-ui-css
& semantic-ui-less
.
To use it:
yarn add --dev @semantic-ui-react/css-patch
# or
npm install --dev @semantic-ui-react/css-patch
postinstall
script to your package.json
{
"scripts": {
"postinstall": "semantic-ui-css-patch"
}
}
¿Semantic UI piensa arreglar este error?
This is caused by an extra semicolon that shouldn't be there, it's on the third line of the error output posted by the issue raiser:
Module build failed: UnhandledSchemeError: Reading from "data:application/x-font-ttf;charset=utf-8;;base64,AAEAAAAOAIAA[...]
Related issue: semantc-ui-css: issue #75
I had the same problem.
What solved it for me was to downgrade react-scripts to version 4.0.3
Eso es una solución temporal, pero no final.
I had the same problem and solved it by downgrading react-scripts to version 4.0.3, too!! Thank you so much, linckalessandro😄
I had the same problem.
What solved it for me was to downgrade react-scripts to version 4.0.3
Thanks @linckalessandro, thats worked for me too.
got the same error too
There are 2 semicolons ' ;; ' somewhere inside semantic.min.css in fomantic-ui-css folder, all you have to do is cntrl + f and search for ;; and remove 1 semicolon , save and compile. It will work👍.
If you remove the dual ;; you will also need to delete the node_modules/.cache folder as well. It doesn't seem to pickup the change without doing that.
I had the same problem.
What solved it for me was to downgrade react-scripts to version 4.0.3
Thank you
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
.To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
Followed this and still not working. May be I did something wrong.
Would you be able to write a step-by-step guide to doing this? Would really appreciate it. Thank you
p.s. it only works if I downgrade react scripts to 4.0.3
@yapalfredo tested with react script 5
"scripts": {
"start": "semantic-ui-css-patch && react-scripts start",
"build": "semantic-ui-css-patch && react-scripts build"
}
This issue still exists
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
.To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
I followed this and got it to work. Although I had to clear the cache before it would work.. del node_modules npm cache clean --force npm install npm start
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
. To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
I followed this and got it to work. Although I had to clear the cache before it would work.. del node_modules npm cache clean --force npm install npm start
It work for me, awesome thanks
npm install --dev @semantic-ui-react/css-patch
This solved the issue! Thanks mate!
Maybe this is a dumb question, but why doesn't someone just remove the extra semi-colon from the source and update the version so we don't all need to jump through hoops installing patches?
Maybe this is a dumb question, but why doesn't someone just remove the extra semi-colon from the source and update the version so we don't all need to jump through hoops installing patches?
I also got that doubt..
Maybe this is a dumb question, but why doesn't someone just remove the extra semi-colon from the source and update the version so we don't all need to jump through hoops installing patches?
Fix can be only released to NPM by @jlukic. The last SUI released happened in 2018.
So, unfortunately.... Use patches or switch to Fomantic UI
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
. To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
I followed this and got it to work. Although I had to clear the cache before it would work.. del node_modules npm cache clean --force npm install npm start
This work for me too
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
.To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
This worked correctly for me, but why hasn't that error been fixed in the library itself?
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
.To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
Thanks, works a charm!
A few comments have suggested it didn't work or needing to delete node_modules\clear cache\reinstall\etc to get it to work. There's no need to do any of those - just run the postinstall script after installing it and adding the script in package.json; this will apply the patch without needing to reinstall modules:
npm run postinstall
If you remove the dual ;; you will also need to delete the node_modules/.cache folder as well. It doesn't seem to pickup the change without doing that.
Thank you!! This worked for me. I actually uninstalled and installed fomantic and the problem still persisted. Until I deleted the cache folder (stating this in case anyone has the same issue) Thanks again!
This issue is extremely annoying, to workaround it I created
@semantic-ui-react/css-patch
, works withsemantic-ui-css
&semantic-ui-less
. To use it:
- Install it
yarn add --dev @semantic-ui-react/css-patch # or npm install --dev @semantic-ui-react/css-patch
- Add it as a
postinstall
script to yourpackage.json
{ "scripts": { "postinstall": "semantic-ui-css-patch" } }
Thanks, works a charm!
A few comments have suggested it didn't work or needing to delete node_modules\clear cache\reinstall\etc to get it to work. There's no need to do any of those - just run the postinstall script after installing it and adding the script in package.json; this will apply the patch without needing to reinstall modules:
npm run postinstall
This works for me with create react app, react 18.2.0
I had the same problem.
What solved it for me was to downgrade react-scripts to version 4.0.3
This worked for me as well, currently with these React and Semantic-UI-CSS versions: "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "^4.0.3", "semantic-ui-css": "^2.4.1", "semantic-ui-react": "^2.1.3",
I had the same problem. What solved it for me was to downgrade react-scripts to version 4.0.3
This worked for me as well, currently with these React and Semantic-UI-CSS versions: "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "^4.0.3", "semantic-ui-css": "^2.4.1", "semantic-ui-react": "^2.1.3",
same here, some ppl ahve to be reminded that sometimesnpm audit fix --force
will be needed after trying some versions
OMG so glad I found this...my react app would not compile and sure enough, in the min.css file there's a double ;;
Downgrading react scripts also seems to do the trick but I fixed the glitch as they say.
I've merged the relevant PR, will update NPM this weekend.
If anyone encounters any issues of this severity again feel free to reach me at jack@semantic-ui.com and I can look at them more promptly.
Should be released now.
Thanks, confirming v2.5.0 has resolved the issue for us.
There are 2 semicolons ' ;; ' somewhere inside semantic.min.css in fomantic-ui-css folder, all you have to do is cntrl + f and search for ;; and remove 1 semicolon , save and compile. It will work👍.
Could run
may need to ajust the location, as this is for my project
sed -i 's/;;/;/g' /src/style/semantic.css
This method still didn't work for me: https://github.com/Semantic-Org/Semantic-UI/issues/7073#issuecomment-1186172553. Still getting this error: Error: Can't resolve 'themes/default/assets/images/flags.png' in '/Users/username/Documents/GitHub/githubfolder/node_modules/semantic-ui-css'
Title (Put in field above)
Use the format: [Component] Component Should Do X i.e. [Checkbox] onChange Should Fire When Update Triggered via DOM
Steps
1). Create proyect React to command
npx create-react-app myapp
2). Move to folder project
cd ./myapp
3). Install Semantic UI CSS
yarn add semantic-ui-css
4). Import semantic to myapp/src/index.js
import "semantic-ui-css/semantic.css";
5). Start project for comand
Actual Result ERROR