My app should be able to be used on at least Android 8 + 9.
While using Angular 15, I had set compilerOptions.target to “ES5” in tsconfig.json.
Until Angular 16, it’s not possible to overwrite the compilerOptions.target option, anymore. Internally, the target ES2022 is used:
TypeScript compiler options “target” and “useDefineForClassFields” are set to “ES2022” and “false” respectively by the Angular CLI. To control ECMA version and features use the Browerslist configuration. For more information, see Angular
It seems you’re encountering compatibility issues when trying to use Ionic 7 and Angular 16 for your app on Android 8 and 9 devices. The problem appears to be related to the TypeScript target and the browser compatibility settings.
Here are some steps you can take to address this issue:
Check Angular CLI and TypeScript Versions: Ensure that you are using the latest versions of Angular CLI and TypeScript, as newer versions often come with improved compatibility and features. You can update them using npm or yarn:
Update Browserslist Configuration: It’s good that you’ve configured the browserslist, but you may need to adjust it to target ES5 compatibility. Try modifying your browserslist configuration to target ES5-compatible browsers specifically:
"browserslist": "> 0.5%, last 2 versions, Firefox ESR, not dead, not IE 11, not IE_Mob 11"
This configuration should target browsers that are ES5-compatible.
3. Check for Deprecated Code: Review your codebase for any usage of features that are not supported in ES5, such as the ?. operator or other ES6/ES2015 features. Replace or refactor these portions of code to make them compatible with ES5.
4. Polyfills: Ensure that you have the necessary polyfills included in your project to provide ES5 support. In your polyfills.ts file, make sure you import any required polyfills.
5. Targeted Build: When building your Ionic app, specify the target environment explicitly by using the --prod flag, which optimizes the build for production and may target ES5:
ionic build --prod
Testing: Test your app on Android 8 and 9 devices to ensure that it works as expected.
Community Resources: Check for any community discussions or issues related to using Ionic 7 and Angular 16 on Android 8/9 devices. Other developers may have encountered similar problems and found solutions.
Remember that Ionic and Angular are actively maintained, and updates are released regularly to address compatibility and performance issues. If you continue to face difficulties, it might be worth checking the official release notes and documentation for any specific guidance related to your setup. Click here for fun!