Vercel Deployment failed "react-scripts build" exited with 1 - vercel

I tried to deploy my react site to vercel. But deployment failed with error. Please help to me fix this.
fresh packages...
[14:35:44.935] success Saved lockfile.
[14:35:44.944] Done in 66.75s.
[14:35:48.226] Creating an optimized production build...
[14:36:21.640] Browserslist: caniuse-lite is outdated. Please run:
[14:36:21.640] npx browserslist#latest --update-db
[14:36:21.640] Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
[14:36:22.326] Browserslist: caniuse-lite is outdated. Please run:
[14:36:22.327] npx browserslist#latest --update-db
[14:36:22.327] Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
[14:36:23.309] Failed to compile.
[14:36:23.310]
[14:36:23.310] Error: error:0308010C:digital envelope routines::unsupported
[14:36:23.310] at String.replace (<anonymous>)
[14:36:23.310]
[14:36:23.310]
[14:36:23.385] Error: Command "react-scripts build" exited with 1

Related

Parcel keeps rewriting srcs and hrefs after parsing "parcel <folder>/index.html" but not after "parcel index.html" (while inside dir)

I just started learning Parcel, so apologies if this question makes no sense.
Basically, when I'm inside a projectName/dist parcel index.html works just fine however when I'm in projectName dir and try parcel .\dist\index.html I get this monstrosity:
‼ Could not load existing sourcemap of "base.cf80568e.css".
Browserslist: caniuse-lite is outdated. Please run:
× C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js: ENOENT: no such file or directory, open 'C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js'
Error: ENOENT: no such file or directory, open 'C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js'
‼ Could not load existing sourcemap of "style.251b6741.css".
‼ Could not load existing sourcemap of "base.cf80568e.css".
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Inside html, my css and js references change from e.g. style.css to /style.251b6741.eb5df69a.css (which gets created in dist folder and is the exact copy of style.css).
Also after parsing npx browserslist#latest --update-db in terminal, I get a message that everything is up to date???
I have no clue why it does that, I've searched the internet for somebody to have the same problem for about 2h now, to no avail :c

How do I compile react-native android?

I have created a react-native app. I did it according to the instructions from the official "React" website. but my react-native android project won't start.
Console:
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 1289 file(s) to forward-jetify. Using 8 workers...
info Starting JS server...
info Installing the app...
:ReactNative:Unexpected empty result of running '[node, C:\Users\Кирилл\Desktop\helloWorld\MyReactNative\node_modules\#react-native-community\cli\build\bin.js, config]' command.
:ReactNative:Running '[node, C:\Users\Кирилл\Desktop\helloWorld\MyReactNative\node_modules\#react-native-community\cli\build\bin.js, config]' command failed.
FAILURE: Build failed with an exception.
* Where:
Script 'C:\Users\������\Desktop\helloWorld\MyReactNative\node_modules\#react-native-community\cli-platform-android\native_modules.gradle' line: 195
* What went wrong:
A problem occurred evaluating script.
> node:internal/modules/cjs/loader:903 throw err; ^Error: Cannot find module 'C:\Users\Кирилл\Desktop\helloWorld\MyReactNative\node_modules\#react-native-community\cli\build\bin.js' at Function.Module._resolveFilename (node:internal/modules/cjs/loader:900:15) at Function.Module._load (node:internal/modules/cjs/loader:745:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:72:12) at node:internal/main/run_main_module:17:47 { code: 'MODULE_NOT_FOUND', requireStack: []}
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 9s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
:ReactNative:Unexpected empty result of running '[node, C:\Users\Кирилл\Desktop\helloWorld\MyReactNative\node_modules\#react-native-community\cli\build\bin.js, config]' command.
npm ERR! code 1
npm ERR! path C:\Users\Кирилл\Desktop\helloWorld\MyReactNative
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c "react-native run-android"
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Кирилл\AppData\Local\npm-cache\_logs\2020-11-13T08_19_01_474Z-debug.log
What should I do?
I have android sdk on drive D and jdk on drive C. Because of this, nothing worked. I have reinstalled android studio, sdk and jdk. Everything worked.
I have also faced this same issue in a React-Native project version 0.61.
I am now able to solve this issue by changing to Gradle version to 6.9.
My previous Gradle version was 6.4.1

How to setup `react-native-web` after `react-native init`

I get several errors after following the guide on react-rative-web.
I first created a new project: react-native init test --version 0.55.4
Then I installed the dependencies:
yarn add --dev babel-loader url-loader webpack webpack-cli webpack-dev-server babel-plugin-react-native-web
yarn add react react-dom react-native-web
copied the index.web.js and web/webpack.config.js
After executing the command:
webpack-dev-server -d --config ./web/webpack.config.js --inline --hot --colors
I get the error:
ERROR in ./index.web.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'react-art'
OK. So I installed the (optional?) module yarn add react-art
The next run printed:
ERROR in ./index.web.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin 0 specified in "base" provided an invalid property of "createElement"
Now I don't know what to do. How can I fix this error (and maybe the following)?

Yarn Install Error: Arguments: -c ./node_modules/.bin/typings install

When trying to run yarn install I am getting:
Jasons-MacBook-Pro: jasonbiondo$ yarn install
yarn install v0.21.3
[1/4] :mag: Resolving packages...
[2/4] :truck: Fetching packages...
[3/4] :link: Linking dependencies...
[4/4] :page_with_curl: Building fresh packages...
[1/6] ⠂ aurelia-infinite-scroll
[2/6] ⠂ fsevents
[3/6] ⠂ gifsicle
[4/6] ⠂ mozjpeg
error /Users/jasonbiondo/Sites/mysite-app/node_modules/aurelia-infinite-scroll: Command failed.
Exit code: 127
Command: sh
Arguments: -c ./node_modules/.bin/typings install
Directory: /Users/jasonbiondo/Sites/mysite-app/node_modules/aurelia-infinite-scroll
Output:
sh: ./node_modules/.bin/typings: No such file or directory
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
Note: This does not throw an error with npm install.
Here is a link to a gist of my package.json: https://gist.github.com/jasonbiondo/fac812526499c99e44c171645bee5533

ReactNativeCli init Helloworld project build error with Babel TransformError

I'm trying to learn React Native development by following instruction:
nvm install v4.2.6
nvm alias default v4.2.6
npm install -g react-native-cli
react-native init RNApp
cd RNAPP
Then I open iOS app project and compile program. Then I got follow error:
...
++ NVM_NPM_PREFIX=/Users/user/.nvm/versions/node/v4.2.6
++ nvm_tree_contains_path /Users/user/.nvm /Users/user/.nvm/versions/node/v4.2.6
++ '[' -n '' ']'
+ [[ -x /Users/user/.nodenv/bin/nodenv ]]
+ react-native bundle --entry-file index.ios.js --platform ios --dev true --bundle-output /Users/user/Library/Developer/Xcode/DerivedData/RNApp-ckxusxiznabgxxcrqessfpbjyrks/Build/Products/Debug-iphonesimulator/RNApp.app/main.jsbundle --assets-dest /Users/user/Library/Developer/Xcode/DerivedData/RNApp-ckxusxiznabgxxcrqessfpbjyrks/Build/Products/Debug-iphonesimulator/RNApp.app
bundle: Created ReactPackager
uncaught error Error: ReferenceError: [BABEL] /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/.babelrc.stage
at Logger.error (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/logger.js:41:11)
at OptionManager.mergeOptions (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:262:18)
at OptionManager.addConfig (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:221:10)
at OptionManager.findConfigs (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:364:16)
at OptionManager.init (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:412:12)
at File.initOptions (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/index.js:191:75)
at new File (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/index.js:122:22)
at Pipeline.transform (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/pipeline.js:42:16)
at transform (/Users/user/Desktop/RNApp/node_modules/react-native/packager/transformer.js:59:24)
TransformError: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/.babelrc.stage
See logs /var/folders/g9/m3cmg0m10cl80xt362wpsld00000gn/T/react-packager.log
at SocketClient._handleMessage (SocketClient.js:139:23)
at BunserBuf.<anonymous> (SocketClient.js:53:42)
at emitOne (events.js:77:13)
at BunserBuf.emit (events.js:169:7)
at BunserBuf.process (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/bser/index.js:289:10)
at /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/bser/index.js:244:12
at nextTickCallbackWith0Args (node.js:419:9)
at process._tickCallback (node.js:348:13)
Command /bin/sh failed with exit code 1
Is I do something wrong? or just there is something bug in babel for react-native support?
➜ RNApp react-native --version
react-native-cli: 0.1.10
react-native: 0.18.1
But it seems that run-android is working fine:
:app:generateDebugSources
:app:processDebugJavaRes UP-TO-DATE
:app:compileDebugJavaWithJavac
:app:compileDebugNdk UP-TO-DATE
:app:compileDebugSources
:app:preDexDebug
:app:dexDebug
:app:validateDebugSigning
:app:packageDebug
:app:zipalignDebug
:app:assembleDebug
:app:installDebug FAILED
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: No connected devices!
This root cause of the issue is that React Native uses Babel 6, which deprecated the use of the stage option on .babelrc files, and react-deep-force-update, a sub-dependency of React Native, still declares a .babelrc file with that option.
This is an issue with any third party modules that still use an older Babel in their own build process and do not clear the configuration files for the npm publish.
I have worked around the issue by adding the following npm run scripts to my package json:
"scripts": {
"clean:babelrc": "find ./node_modules -name react-packager -prune -o -name '.babelrc' -print | xargs rm -f",
"postinstall": "npm run clean:babelrc"
}
The script nukes all .babelrc files under the node_modules directory after every npm install, except the one under the react-packager directory, which is React Native packager uses to configure its own babel rules.
The issue is being tracked on React Native GitHub repository.
I updated the npm packages.
react-proxy ==> 1.1.2
react-deep-force-update ==> 2.0.1
You need remove the packages files first in node_modules. Then install the new version.
It works for me.