How To Enable Proguard with react native? - javascript

I want to reduce my APK Size
I followed these https://facebook.github.io/react-native/docs/signed-apk-android
and run ./gradlew bundleRelease instead of assembleRelease
But I Got Error
Execution failed for task ':app:transformClassesAndResourcesWithProguardForRelease'.
Job failed,
So how can I solve it, I'm Google it but the issue is still!
But without Enable Proguard it's work very well and I got (Aab & .Apk ) SO How To Solve it!
I think the issue with this file but I don't know how to configure that!
proguard-rules.pro
# If your project uses WebView with JS, uncomment the following
# and specify the fully qualified class name to the JavaScript interface
# class:
#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
# public *;
#}
Package.json
{
"name": "APP_NAME",
"version": "1.12.3",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"#react-native-community/async-storage": "^1.4.2",
"#turf/distance": "^6.0.1",
"#turf/helpers": "^6.1.4",
"#turf/invariant": "^6.1.2",
"#turf/turf": "^5.1.6",
"firebase-admin": "^8.1.0",
"firebase-functions": "^3.0.1",
"lodash": "^4.17.11",
"moment": "^2.24.0",
"react": "16.8.6",
"react-moment": "^0.9.2",
"react-native": "0.59.8",
"react-native-app-intro-slider": "^3.0.0",
"react-native-datepicker": "^1.7.2",
"react-native-fcm": "^16.2.4",
"react-native-firebase": "5.3.1",
"react-native-gesture-handler": "1.2.1",
"react-native-image-picker": "^0.28.0",
"react-native-linear-gradient": "^2.5.4",
"react-native-maps": "^0.24.2",
"react-native-stars": "^1.1.5",
"react-native-svg": "^9.3.3",
"react-native-vector-icons": "^6.4.2",
"react-navigation": "3.11.0"
},
"devDependencies": {
"#babel/parser": "^7.4.4",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "24.8.0",
"jest": "24.8.0",
"metro-react-native-babel-preset": "0.54.1",
"react-devtools": "^3.6.1",
"react-test-renderer": "16.8.6"
},
"jest": {
"preset": "react-native"
}
}

If you want Proguard Enabled (minifyEnabled true in android/app/build.gradle) while using "react-native-firebase" package in your app, you need to update your proguard rules.
in (android/app/proguard-rules.pro)
add the following lines:
-keep class io.invertase.firebase.** { *; }
-dontwarn io.invertase.firebase.**
for more information you can check https://rnfirebase.io/docs/v5.x.x/installation/android just before Step 4.
If it doesn't work out, you must go to documentations of the other packages you use and lookup for additional preferences must be done in order to make their settings compatible with Proguard enabled.

Related

Running "npm run dev" throws "Input Error: You must pass a valid list of files to parse" error

I'm trying to make a Shopify Hydrogen app and install TailwindCSS.
I've followed all the steps in the Hydrogen docs: https://shopify.dev/docs/custom-storefronts/hydrogen/building/begin-development
For some reason I cannot run the scripts due to the previously mentioned error.
Dependencies:
"dependencies": {
"#remix-run/react": "1.12.0",
"#shopify/cli": "3.29.0",
"#shopify/cli-hydrogen": "^4.0.6",
"#shopify/hydrogen": "^2023.1.4",
"#shopify/remix-oxygen": "^1.0.3",
"graphql": "^16.6.0",
"graphql-tag": "^2.12.6",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"#remix-run/dev": "1.12.0",
"#shopify/prettier-config": "^1.1.2",
"autoprefixer": "^10.4.13",
"concurrently": "^7.6.0",
"eslint": "^8.20.0",
"eslint-plugin-hydrogen": "0.12.2",
"postcss": "^8.4.21",
"postcss-cli": "^10.1.0",
"prettier": "^2.8.4",
"tailwindcss": "^3.2.7"
},

Module not found: Error: Can't resolve 'core-js/modules/es.error.cause.js'

I am using Vuexy Dashboard in my project, Vuexy comes in with Vue 2, so I am trying to upgrade it to Vue 3, after fixing some errors, I'm stuck on this one, any help is much appreciated.
Thank you.
This is my package.json file :
{
"name": "vuexy-vuejs-react-html-laravel-admin-dashboard-template",
"version": "6.4.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --skip-plugins #vue/cli-plugin-eslint",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"#casl/ability": "4.1.6",
"#casl/vue": "1.1.1",
"#vue/cli-plugin-eslint": "^5.0.4",
"#vue/compat": "^3.1.0-0",
"#vue/composition-api": "^1.6.1",
"#vueuse/core": "4.0.0",
"animate.css": "4.1.1",
"apexcharts": "^3.35.2",
"assert": "^2.0.0",
"axios": "^0.27.2",
"axios-mock-adapter": "1.19.0",
"bootstrap": "4.6.0",
"bootstrap-vue": "2.21.1",
"buffer": "^6.0.3",
"chart.js": "2.9.4",
"core-js": "3.8.1",
"echarts": "4.8.0",
"jsonwebtoken": "8.5.1",
"leaflet": "1.6.0",
"portal-vue": "2.1.7",
"postcss-rtl": "1.7.3",
"prismjs": "^1.28.0",
"stream": "0.0.2",
"swiper": "5.4.5",
"uuid": "8.3.2",
"vue-perfect-scrollbar": "0.2.1",
"vue-prism-component": "1.1.1",
"vue-quill-editor": "3.0.6",
"vue-ripple-directive": "2.0.1",
"vue-router": "3.4.9",
"vue-select": "3.11.2",
"vue-slider-component": "3.2.11",
"vue-sweetalert2": "4.1.1",
"vue-toastification": "1.7.8",
"vue-tour": "1.5.0",
"vue-tree-halower": "1.8.3",
"vue2-leaflet": "2.5.2",
"vuedraggable": "2.24.3",
"vuex": "3.6.0"
},
"devDependencies": {
"#babel/core": "^7.12.16",
"#babel/eslint-parser": "^7.12.16",
"#vue/cli-plugin-babel": "^5.0.4",
"#vue/cli-plugin-router": "^5.0.4",
"#vue/cli-plugin-vuex": "^5.0.4",
"#vue/cli-service": "^5.0.4",
"#vue/compiler-sfc": "^3.1.0-0",
"#vue/eslint-config-airbnb": "^6.0.0",
"#vuepress/plugin-medium-zoom": "^1.7.1",
"eslint": "^7.32.0",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-vue": "^8.0.3",
"eslint-plugin-vuejs-accessibility": "^1.1.1",
"sass": "1.32.*",
"sass-loader": "^10.1.0"
}
}
And these are the errors I'm getting while running npm run serve :
ERROR in ./node_modules/#babel/runtime/helpers/esm/nonIterableSpread.js 1:0-43
Module not found: Error: Can't resolve 'core-js/modules/es.error.cause.js' in 'Desktop\consigliere-vue-laravel\e-commerce\frontend\node_modules\#babel\runtime\helpers\esm'
After searching a lot, what works for me was what I found in this blog post:
https://blog.csdn.net/Missbelover/article/details/123221351
Basically, what you need to do is...
Remove all your node_modules dependencies.
npm rm -rf node_modules
Install core-js first.
npm install --save core-js
Finally install everything else.
npm install
yarn install
After this everything should work as expected, a least for me is working now.
Have a good day!
My issue was having 2 projects that differ because they use yarn and npm. I made the mistake of installing jest globally with yarn so had conflicts with my jest version. I ran yarn remove global jest and it worked.

"You require appropriate loaders", Using react native and expo. App fails to compile on the web, but runs on android

I'm using react native expo. The app works fine on android, but when run on the web gets a compilation error. It was working fine in before, but I suspect this started after installing some new package.
/ReactNativeFrontend/node_modules/#codler/react-native-keyboard-aware-scroll-view/lib/KeyboardAwareHOC.js 13:12
Module parse failed: Unexpected token (13:12)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| } from 'react-native'
| import { isIphoneX } from 'react-native-iphone-x-helper'
> import type { KeyboardAwareInterface } from './KeyboardAwareInterface'
|
| const _KAM_DEFAULT_TAB_BAR_HEIGHT: number = isIphoneX() ? 83 : 49
My babel config
module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
};
};
My package.json
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#codler/native-base": "^2.14.2",
"#material-ui/core": "^4.11.0",
"#react-native-community/art": "^1.2.0",
"#react-native-community/async-storage": "^1.11.0",
"#react-native-community/datetimepicker": "^2.4.0",
"#react-native-community/masked-view": "0.1.10",
"#react-native-community/voice": "^1.1.6",
"#risingstack/react-easy-state": "^6.3.0",
"axios": "^0.19.2",
"easy-peasy": "^3.3.1",
"expo": "~38.0.8",
"expo-camera": "^8.3.1",
"expo-constants": "^9.1.1",
"expo-font": "~8.2.1",
"expo-gl": "^8.3.1",
"expo-image-picker": "^8.3.0",
"expo-permissions": "^9.0.1",
"expo-pixi": "^1.2.0",
"expo-speech": "~8.2.1",
"expo-status-bar": "^1.0.2",
"i18n-js": "^3.7.1",
"lodash.memoize": "^4.1.2",
"native-base": "^2.13.12",
"proxy": "^1.0.2",
"react": "~16.11.0",
"react-dom": "~16.11.0",
"react-instantsearch-native": "^6.7.0",
"react-native-chatbot": "0.0.1-alpha.12",
"react-native-datepicker": "^1.7.2",
"react-native-dialogflow": "^3.2.2",
"react-native-elements": "^2.0.4",
"react-native-fade-in-view": "^1.1.0",
"react-native-gesture-handler": "~1.6.0",
"react-native-gifted-chat": "^0.16.3",
"react-native-localization": "^2.1.6",
"react-native-localize": "^1.4.1",
"react-native-no-flicker-image": "^1.0.2",
"react-native-paper": "^4.0.1",
"react-native-reanimated": "~1.9.0",
"react-native-safe-area-context": "~3.0.7",
"react-native-screens": "~2.9.0",
"react-native-signature-capture": "^0.4.10",
"react-native-star-rating": "^1.1.0",
"react-native-vector-icons": "^7.0.0",
"react-native-voice": "^0.3.0",
"react-native-web": "~0.11.7",
"react-navigation": "^4.4.0",
"react-navigation-stack": "^2.8.2",
"react-navigation-tabs": "^2.9.0",
"styled-components": "^5.1.1"
},
"devDependencies": {
"#babel/core": "^7.8.6",
"#babel/preset-env": "^7.11.0",
"babel-preset-expo": "~8.1.0",
"react-native": "^0.63.2"
},
"private": true,
"rnpm": {
"assets": "./assets/fonts"
},
"proxy": "http://localhost:19002"
}
How to add appropriate loaders, or identify the package causing this issue.
I had this exact same issue, I found a solution today.
Thanks to this kind user on the expo forums.
judipuak's post
Install the react-native-keyboard-aware-scroll-view package into your node_modules with yarn on npm
Navigate to native base/dist/src/basic and open Content.js
Find var _reactNativeKeyboardAwareScrollView=require('#codler/react-native-keyboard-aware-scroll-view')
Change this to var _reactNativeKeyboardAwareScrollView=require('react-native-keyboard-aware-scroll-view') (remove the #codler)
Update:
Here's a more permanent solution
courtesy of patarapolw
I downgrade two things, and upgrade one thing, in package.json
{
"dependencies": {
"native-base": "~2.11",
"react-native-web": "~0.11"
},
"resolutions": {
"react-native-keyboard-aware-scroll-view": "^0.9.0"
},
}
This is a native-base library problem. While You are using it's some Components there might error occur. I found that this error is not occurring in 2.11 or it's less version so try to install that specific version
npm install native-base#2.11

React Native IOS platform 'folly/Portability.h' file not found

I looked at previously opened topics, no solution,
https://stackoverflow.com/a/25257238/12702367
I followed the instructions. I get an error when I start from xcode
'folly/Portability.h' file not found
xcode returns this error
There is no file called folly
enter image description here
{
"name": "..",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"#react-native-community/async-storage": "^1.6.2",
"#react-native-community/datetimepicker": "^2.1.0",
"axios": "^0.19.0",
"buffer": "^5.4.3",
"formik": "^1.5.2",
"mobx": "^5.9.4",
"mobx-react": "^5.4.3",
"moment": "^2.24.0",
"native-base": "^2.13.8",
"react": "16.8.3",
"react-native": "0.59.8",
"react-native-24h-timepicker": "^1.0.0",
"react-native-flash-message": "^0.1.15",
"react-native-gesture-handler": "^1.1.0",
"react-native-image-picker": "^0.27.2",
"react-native-image-resizer": "^1.0.1",
"react-native-maps": "https://github.com/react-native-community/react-native-maps.git#c102c36d895cbef8b6a8deefd4c58fb0dc17638e",
"react-native-uuid": "^1.4.9",
"react-native-permissions": "2.0.0",
"react-native-vector-icons": "^6.6.0",
"react-navigation": "^3.6.1",
"recyclerlistview": "^2.0.12",
"yup": "^0.27.0"
},
"devDependencies": {
"#babel/core": "7.6.2",
"#babel/plugin-proposal-decorators": "^7.6.0",
"#babel/runtime": "7.6.2",
"babel-jest": "24.9.0",
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"babel-plugin-transform-remove-console": "^6.9.4",
"jest": "24.9.0",
"metro-react-native-babel-preset": "0.56.0",
"react-test-renderer": "16.8.3"
},
"jest": {
"preset": "react-native"
},
"rnpm": {
"assets": [
"resources/fonts"
]
}
}
The current podfile.
Could the source of the error be because the folly folder is not transferred correctly?
# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'
target '..' do
# Comment the next line if you don't want to use dynamic frameworks
use_frameworks!
# Pods for ..
# Pods for ..
pod 'React', :path => '../node_modules/react-native'
pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
pod 'RNPermissions', :path => '../node_modules/react-native-permissions'
# Third party deps podspec link
pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
target '..Tests' do
inherit! :search_paths
# Pods for testing
end
end
That means you haven't properly installed pods! The error says that the Xcode is unable to find the .h file because it is unable to see such libraries or path in project! Try to clean the code first then switch to the terminal and install pod again! I hope it might solve your issue!

Plugin 0 specified, provided an invalid property of "default" (Jest React Native)

Hey all I am just trying to get a simple test running and I keep running into this error after running "yarn test" which is using jest.
Plugin 0 specified in "/Users/Documents/Dev/appname/node_modules/babel-preset-react-native/index.js" provided an invalid property of "default" (While processing preset: "/Users/Documents/Dev/appname/node_modules/babel-preset-react-native/index.js")
at Plugin.init (node_modules/babel-core/lib/transformation/plugin.js:131:13)
at Function.normalisePlugin (node_modules/babel-core/lib/transformation/file/options/option-manager.js:152:12)
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:184:30
at Array.map (<anonymous>)
at Function.normalisePlugins (node_modules/babel-core/lib/transformation/file/options/option-manager.js:158:20)
at OptionManager.mergeOptions (node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:36)
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:265:14
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:323:22
at Array.map (<anonymous>)
at OptionManager.resolvePresets (node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
Here is my package.json, what am I missing, im sure its a configuration issue and not a test issue.
{
"name": "appname",
"version": "0.0.1",
"private": true,
"rnpm": {
"assets": [
"resources/fonts"
]
},
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"axios": "^0.18.0",
"lodash": "^4.17.10",
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-autocomplete-input": "^3.5.0",
"react-native-code-push": "^5.4.2",
"react-native-elements": "^1.0.0-beta2",
"react-native-form-validator": "^0.2.0",
"react-native-image-pan-zoom": "^2.1.9",
"react-native-image-zoom-viewer": "^2.2.18",
"react-native-material-dropdown": "^0.11.1",
"react-native-remote-svg": "^1.3.0",
"react-native-vector-icons": "^5.0.0",
"react-native-version-number": "^0.3.5",
"react-navigation": "^2.11.2"
},
"devDependencies": {
"babel-jest": "23.4.2",
"babel-preset-react-native": "^5",
"jest": "23.5.0",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}
don't know if you solved that already but I had the same issue and I was able to make things work again with RN 0.56. I changed this:
"babel-preset-react-native": "^5",
to
"babel-preset-react-native": "4.0.0",
here's the full discussion around the issue: https://github.com/storybooks/storybook/issues/3897
if the above breaks your react-native env, another solution would be to install babel-bridge:
npm install babel-core#7.0.0-bridge.0 --save-dev

Categories

Resources