NativeScript: [NS7] - Android error extending custom activity

@mapo80 in your webpack.custom.config.js you are setting

    env.appComponents = env.appComponents || [];
    env.entries = env.entries || {};

But these are not read from env in the main config:

  // Add your custom Activities, Services and other Android app components here.
  const appComponents = [
    "@nativescript/core/ui/frame", "@nativescript/core/ui/frame/activity"
  ];

  // ...
  
  const entries = { bundle: entryPath };

Adding the entry and appComponents to the main config works fine as @bradmartin has tried.

Perhaps we could allow passing these through env - it should be a fairly simple change if you don’t mind opening a pr: https://github.com/NativeScript/NativeScript/tree/master/packages/webpack/templates these are the default templates - that could just use something like this:

{
  // ...
  appComponents = [],
  entries = {}
} = env;

appComponents = appComponents.concat( [
    "@nativescript/core/ui/frame", "@nativescript/core/ui/frame/activity"
]);

entries = Object.assign({ bundle: entryPath }, entries); // this way allows changing `bundle` entry too

I stumbled upon a lot of issues myself trying to get this to work, but I finally got it working.

First off you’ll want to ensure that the NativeClass transformer plugin is configured in your tsconfig.json. Add the following if it isn’t. This will ensure all classes that are decorated with NativeClass are added to the compilation.

"compilerOptions": {
  "plugins": [{
    "transform": "@nativescript/webpack/transformers/ns-transform-native-classes",
    "type": "raw"
  }]
}

Make sure you decorate your activity (and application) with the NativeClass decorator like so.

Activity

@NativeClass()
@JavaProxy('com.my.App.MainActivity')
class MainActivity extends androidx.appcompat.app.AppCompatActivity {

Application

@NativeClass()
@JavaProxy('com.my.App.Application')
class Application extends android.app.Application {

If you get any error about the package already existing, make sure your id in nativescript.config.json and application.android are not the same.

@rigor789 I’ll try to make a PR for webpack.angular.js

Thanks for your advice.

@mapo80 - https://github.com/mapo80/nativescript-ns7-custom-application/pull/1 which basically just added the application file to the main webpack.config, I’m guessing the custom config might not be finding the correct entry point. I noticed during the webpack process after first pulling a warning is printed that the file is included but it’s not being used. Which makes me think how you have the custom config setup to find that file is incorrect somehow.

@bradmartin thanks for your quick reply, that did the trick 😉

@mapo80 you repo in your link doesn’t have the activity in the webpack.config here: https://github.com/mapo80/nativescript-ns7-custom-application/blob/72b7c4afe8092f5ab9264196ef6347f0df1b6eca/webpack.config.js#L30 so I’d add it as I mentioned in my previous comment and see if that helps, I don’t use the file extension on the files as that has always caused me issues with webpack going back over a year ago.

Hey @mapo80 and @shansb-dev can you remove the .ts from the activity in the webpack.config you have. I believe that might be part of the issue.

extended activity

import {
  AndroidActivityCallbacks,
  setActivityCallbacks
} from '@nativescript/core';
import * as application from '@nativescript/core/application';


@NativeClass()
@JavaProxy('com.permobil.smartdrive.wearos.MainActivity')
@Interfaces([androidx.wear.ambient.AmbientModeSupport.AmbientCallbackProvider])
class MainActivity
  extends androidx.appcompat.app.AppCompatActivity
  implements androidx.wear.ambient.AmbientModeSupport.AmbientCallbackProvider {
  constructor() {
    super();
  }

webpack.config.js

 appComponents.push(
    ...['@nativescript/core/ui/frame', '@nativescript/core/ui/frame/activity'],
    resolve(__dirname, 'app/main-activity')
)

Android Manifest

       <!-- for main activity -->
        <activity
            android:name="com.permobil.smartdrive.wearos.MainActivity"
            android:configChanges="keyboardHidden|orientation|screenSize"
            android:label="@string/title_activity_kimera"
            android:launchMode="singleInstance"
            android:theme="@style/LaunchScreenTheme">
            <meta-data

I have this working with 2 different NS7 android apps.

Let me know if this is helpful or not.