BUG: Build is not happening with latest node and yarn version

[muddlebee]

Yarn : 3.1.1
Node : v17.6.0
OS : Ubuntu 20.04

Error logs

➤ YN0000: ┌ Resolution step
➤ YN0002: │ eslint-config-react-app@npm:7.0.0 [9c894] doesn't provide @babel/plugin-syntax-flow (p4202d), requested by eslint-plugin-flowtype
➤ YN0002: │ eslint-config-react-app@npm:7.0.0 [9c894] doesn't provide @babel/plugin-transform-react-jsx (pb90d4), requested by eslint-plugin-flowtype
➤ YN0002: │ react-dev-utils@npm:12.0.0 doesn't provide typescript (p08c91), requested by fork-ts-checker-webpack-plugin
➤ YN0002: │ react-dev-utils@npm:12.0.0 doesn't provide webpack (pf80ce), requested by fork-ts-checker-webpack-plugin
➤ YN0002: │ react-scripts@npm:5.0.0 [9c894] doesn't provide autoprefixer (p5a5c8), requested by tailwindcss
➤ YN0002: │ substrate-front-end-template@workspace:. doesn't provide webpack (p9e29f), requested by node-polyfill-webpack-plugin
➤ YN0000: │ Some peer dependencies are incorrectly met; run yarn explain peer-requirements for details, where is the six-letter p-prefixed code
➤ YN0000: └ Completed in 0s 484ms
➤ YN0000: ┌ Fetch step
➤ YN0013: │ semantic-ui-css@https://github.com/Semantic-Org/Semantic-UI-CSS.git#commit=01e4a5346496c284db3b19a102458731ccccd911 can't be found in the cache and will be fetched f
➤ YN0013: │ semantic-ui-css@https://github.com/Semantic-Org/Semantic-UI-CSS.git#commit=01e4a5346496c284db3b19a102458731ccccd911 can't be found in the cache and will be fetched f
➤ YN0018: │ semantic-ui-css@https://github.com/Semantic-Org/Semantic-UI-CSS.git#commit=01e4a5346496c284db3b19a102458731ccccd911: The remote archive doesn't match the expected checksum
➤ YN0000: └ Completed in 10s 206ms
➤ YN0000: Failed with errors in 10s 706ms

[MaEdAlpha]

Try installing semantic-ui-css first before running yarn install

I used yarn add semantic-ui-react semantic-ui-css

This worked for me.

[muddlebee]

@MaEdAlpha thank you so much. but im still getting a new error after your fix.

➜ substrate-front-end-template git:(e36c75d) ✗ yarn build
Creating an optimized production build...
Failed to compile.

TypeError: Cannot read properties of undefined (reading 'get')

[MaEdAlpha]

Yeah, so after that, you need to go to your semantic.min.css file.

You can hit Ctrl+ P and type the file name. That should bring you there. If not, then it's within your node_modules folder in the semantic-ui-css root folder.

Once you're in the semantic.min.css file search for this....

@font-face{font-family:Rating;src:url(data:application/x-font-ttf;charset=utf-8;;base64,

remove one of the ; beside base64 that should let it compile properly. Apparently someone made a typo on the package, and hasn't fixed it...so just remove that and it should work.

[muddlebee]

hey @MaEdAlpha

rating{font-size:2rem}@font-face{font-family:Rating;src:url(data:application/x-font-ttf;charset=utf-8;base64,

it looks okay only in my semantic.min.css file. I wonder where the issue is 🤔

[muddlebee]

path is something like below

node_modules/semantic-ui-css/semantic.min.css

[muddlebee]

@MaEdAlpha thank you so much.. Actually found the line. there were 4 occurences for the same matching string :)

[MaEdAlpha]

@muddlebee cheers man, glad you found it. have a good one!

[muddlebee]

@jimmychu0807 do you have a permanent fix for this in mind??
or @MaEdAlpha ??

because this will be a recurring issue for forthcoming newbies as well... maybe mention in the DOC?

[MaEdAlpha]

From what I found on the www it's a typo from the semantic package....I didn't look to much into it, but might be worth mentioning in the docs for sure. @jimmychu0807 i've never made a PR. Is it worth mentioning in the front-end-template docs?

[muddlebee]

I think the semantic-ui-css version mentioned here https://github.com/substrate-developer-hub/substrate-front-end-template/blob/main/package.json#L43 also works.

I deleted everything and tried re-installing through yarn install. it seems to work. I tried this on a different OS. Ubuntu WSL..

🤔 strange behaviour..

[nuke-web3]

Sometimes you get issues like this in my experience that as you found a clean are fresh install from scratch solves. I don't think it's specific to this project, but a node/yarn issue. Please lmk if this needs action in this codebase