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
But when compiling my Ionic project, the www directory still contains ES6/ES2015 features like the ?. operator and the app is not working on Android 8/9.
When setting the browserlists config to Chrome >=60 and ChromeAndroid >=60
One or more browsers which are configured in the project’s Browserslist configuration will be ignored as ES5 output is not supported by the Angular CLI.
Ignored browsers: chrome 60
So, it seems that there’s no possibility to configure browserslist to make my code compatible with es5-only browsers?
Is anyone able to run an Ionic 7 + Anuglar 16 app on Android 8/9 devices?
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:
jsonCopy code
"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:
bashCopy code
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!
The previous answer looks like a ChatGPT answer and contains a “Click here for fun” link at the end…
The described instructions doesn’t helped me for solving the issue.
It there no one encountering problems when targeting Android 8/9?
It seems like Angular 15 doesn’t support ES5 anymore:
Producing ES5 output is no longer possible. This was needed for Internet Explorer which is no longer supported. All browsers that Angular supports work with ES2015+
Overwriting the browserlist config doesn’t help, although.
If the issue is the optional chaining (?.) not supported in older browsers, we solved it by using this .browserlist config, as we had issues in iOS 12.5 devices