Rainbow-CPaaS / StarterKit-SDKWeb-Angular2

Starter Kit for the ALE Rainbow SDK for Web based on Angular 2+ environment
2 stars 2 forks source link

Not working after rainbowSDK 1.76 update #11

Open davidromani opened 4 years ago

davidromani commented 4 years ago

Hello.

I'm having a problem very difficult to identify and fix. First of all, my apologies, because I'm working with an Ionic (+4) web app project and I'm not sure if I can post this issue here. But I think that, as far as I know, Ionic it's built on top of angluar/cli so, for me, it seems that the problem is related with Angular (not with Ionic).

After upgrade RainbowSDK from 1.69 up to 1.76, I'm having Uncaught SyntaxError: export declarations may only appear at top level of a module console error in rainbow-sdk.min.js:351:1731483 line

I'm loading resources here:

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <base href="/">
  <meta name="color-scheme" content="light dark">
  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">
  <link rel="icon" type="image/png" href="assets/img/logo.png">
  <script src="assets/js/jquery/jquery.min.js"></script>
  <script src="assets/js/moment/moment-with-locales.min.js"></script>
  <script src="assets/js/angular/angular.min.js"></script>
  <script src="assets/js/rainbow-web-sdk/vendors-sdk.min.js"></script>
  <script src="assets/js/rainbow-web-sdk/rainbow-sdk.min.js"></script>
</head>
<body>
  <app-root></app-root>
</body>
</html>

I've copied jquery-2.1.3, momentjs-2.15.1 and angular.js-1.7.5 versions into my local assets folder following this https://hub.openrainbow.com/#/documentation/doc/sdk/web/guides/Hello_world_legacy example. Finally, I'm importing (and using) SDK here:

// src/app/chat/chat.page.ts
import { Component, OnInit, ViewChild } from '@angular/core';
import { IonContent } from '@ionic/angular';

declare var rainbowSDK: any;

@Component({
  selector: 'app-chat',
  templateUrl: './chat.page.html',
  styleUrls: ['./chat.page.scss'],
})
export class ChatPage implements OnInit
{
  constructor() {}

  ngOnInit()
  {
    console.log('rainbowSDK.version', rainbowSDK.version());
  }
}

The last console error message is:

ERROR Error: Uncaught (in promise): Error: [$injector:modulerr] http://errors.angularjs.org/1.7.5/$injector/modulerr?p0=sdk&p1=%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.7.5%2F%24injector%2Fnomod%3Fp0%3Dsdk%0AM%2F%3C%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A7%3A168%0AEe%2F%3C%2F%3C%2F%3C%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A26%3A453%0Ab%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A25%3A478%0AEe%2F%3C%2F%3C%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A26%3A227%0Ag%2F%3C%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A42%3A496%0Ar%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A8%3A76%0Ag%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A42%3A345%0Afb%40http%3A%2F%2Flocalhost%3A8100%2Fassets%2Fjs%2Fangular%2Fangular.min.js%3A46%3A461%0Ac%40http%3A%2F%2Flocalhost%3A8100%2…
    Angular 17
    Webpack 2
core.js:4197
    Angular 4
    RxJS 5
    Angular 19
    Webpack 2

Can you help me, please? I'm stuck with this issue and I need some ideas to discover what's going on...

Thank you so much in advance.

davidromani commented 4 years ago

Making some tests, I found that I can avoid this problem loading rainbowSDK building my Ionic project without "--prod" flag. With this command works well:

ionic build --engine=browser

But with this one doesn't works:

ionic build --prod --engine=browser

Any hint about what's going on? Thanks.