__APPLE__ is not defined error after upgrading to NativeScript 8.7

__APPLE__ is not defined error, an anoying error that you may facing after upgrading @nativescript/core, @nativescript/ios, @nativescript/android to ^8.7.0.

Although, everybody is recommended to upgrade to NativeScript 8.7 now as it contains many bugfix and improvements such as devtool and bring back network inspection ability which was broken from 8.4. However, some may experience wierd errors such as bellow:

System.err: ReferenceError: __APPLE__ is not defined
  System.err:
  System.err: StackTrace:
  System.err: ./node_modules/@nativescript/core/accessibility/font-scale-common.js(file: src/webpack:/FarmOps/node_modules/@nativescript/core/accessibility/font-scale-common.js:1:7)

The reason

The __APPLE__ is not defined error is due to NativeScript introduce some new placeholders in their build code. Which rely on Webpack to replace at build time. And that logic is introduced in @nativescript/webpack 5.0.19. So the point is to make sure you are using at least 5.0.19 to be able to build your project successfully with NativeScript 8.7.

The solution

So basically, the solution for __APPLE__ is not defined error is to make sure two things:

• First, make sure @nativescript/webpack version is not capped in your package.json , something like this would be the best: ^5.0.0
• Second, make sure your npm is already aware of the latest version available of @nativescript/webpack and nothing is cached. For me, I will rm -rf node_modules , rm package-lock.json and rerun npm i again to be sure. Or simplier, ns clean and rerun.

You can always try take a look in package-lock.json. And look for @nativescript/webpack part. If it appear like this:

It indicates that the actual installed one is 5.0.18 which is no go. And need to be addressed with either methods I mentioned above.

After making sure @nativescript/webpack version is good. You can now ns run again continue your development work with NativeScript.

P/s: If you’re experiencing common NativeScript problems and need some quick fixes or workarounds, be sure to check out our “Quick fix” section. In this section, you’ll find tips & tricks, workaround for resolving common issues that I collected a long the road during my journey with NativeScript. Hope it will help many others like me.

If you still facing the problem with building NativeScript 8.7 project, let me know in the comment I will try help if I can. Cheers. 🥂