App throws when bundling with --uglify and using FadeTransition (for RadSideDrawer)

[NickIliev]

Steps to reproduce - use this application or follow these steps:

• create new app with

tns create myApp --template https://github.com/NativeScript/template-drawer-navigation-ng

• install WebPack

npm install --save-dev nativescript-dev-webpack
npm install

• bundle with uglify

npm run start-android-bundle --uglify

Result: the application is build succsessfully but then throws the following:

JS: Warning: 't' is not supported when 'showOverNavigation' is set to 'true'.
JS: ERROR RangeError: Maximum call stack size exceeded

Reproducible with both official and next releases of tns-core-modules (official 3.1.1) and nativescript-dev-webpack (official 0.7.3).

reported via t1125353

[elvismercado]

i also have this issue with npm run start-ios-bundle --uglify

[ChrAraya]

same here but also have problem with the CSS in the sidebar.

here some examples:

with tns run ios

with npm run start-ios-bundle --uglify and npm run start-ios-bundle

[pako8x]

try
npm install -g npm-check-updates
ncu -u
npm install

and then
npm run start-ios-bundle --uglify

It worked for me

[mhadaily]

I have the same issue even with other transition such public sideDrawerTransition: DrawerTransitionBase = new PushTransition();

tns-ios version: 3.4
nativescript-pro-ui version: 3.3.0

thanks, guys.

[felipebueno]

Hi, @charaya!

Did you manage to solve the CSS problem with the sidedrawer? I'm facing the same issue at this moment and I have no clue on how to fix that.

With webpack 👎

Without webpack 👍

[sis0k0]

@felipebueno, can you share your project or some steps to reproduce the issue? The css looks ok if I use the drawer template and build the app with tns run android --bundle --env.uglify.

[felipebueno]

Ok, just a follow up on my previous comment.

As a temporary solution, I moved all the custom styles from the app/shared/my-drawer/_MyDrawer.scss file to the app/_app-common.scss and it works as expected.

@sis0k0 Hmm, I can't share the project (becaus it's not mine) but I'll create a new project using the template-drawer-navigation template and try to reproduce the problem. I'll comment here again as soon as I publish it to a repository so you can take a look.

Thanks, @sis0k0

[felipebueno]

@sis0k0 I managed to get it working :)

I'm not sure what was the problem but here's what I did.

I created a new project with the drawer-navigation template, bundled it with webpack and run it on my device. Everything worked properly, including the drawer's styles.

Then I copied the drawer module from this new project to my main project (that one from the screenshots above) and updated all my pages to use this new app/shared/drawer module instead of the old app/shared/my-drawer. I bundled the app and it woked :)

I have no idea why this worked but I have some guesses. I noticed that the new project I created with the drawer template was different from the one I created three weeks ago which is the one I'm using to build my project on. Maybe they fixed some bugs, I don't know... will look into it another time. Getting back to work now 😄