Angular 7 App ng build Works But ng build --prod Gives Error

Hello,

Recently I was trying to generate production build of one of our older Angular app which was built on Angular 6 and later upgraded to Angular 7. When we run ng build it works fine but when we run ng build --prod it gives so many errors.

Here in this blog I am going to explain what are those errors and how I solved it.

Problem 1 : Strict Parameter checking for function.

There were few events and handler defined in the app where there were parameter mismatch. For example in html file we have following event.

<componentName (event)="eventHandler($event)"></componentName >

And in component TS file event handler was defined like this

eventHandler() {
}

As you can see from html file it was passing $event param but on handler param was not mentioned. So make sure that your function signature and function declaration matches.

Problem 2 : Duplicate Declaration of Components

By mistake we have duplicate declaration of components in both App module and and other child modules of the app. Make sure you either declare all your components to app module or if you are defining it into sub module then make sure you remove it from app module.

Problem 3 : Cannot read property 'moduleType' of undefined

When you face above issue please check your app module by mistake you may have defined following line twice in your app module.

platformBrowserDynamic().bootstrapModule(AppModule);

It's like you are trying to bootstrap your Angular app twice and it gives above error. So try to avoid it.

Problem 4 : Enable IVY

In Angular 7 by default IVY is disabled hence even if you generate production build you app size it bit large. To enable IVY add following line to your tsconfig.json file.

"angularCompilerOptions": {
    "enableIvy": true
}

Hope this blog post helps you.

Laravel App Connect and Emit to Socket.io

Hello,

Recently in one of the project I was working on we have socket.io server created using NodeJS and there were couple of Angular applications and android applications connects with it. However there was a requirement to connect with socket from Laravel app and emit the event.

Actually there was a form in Laravel app on submit of Form we have to notify the socket and socket further notify all the clients connected to it. In this blog I am going to mention how we solved this.

We all know Laravel by default comes with integration of Pusher we could have used it. But since Socket.io is free so we consider to use Socket.io.

Let's go step by step and understand how to connect with Socket.io

Step 1

Create new folder socket in your app directory of Laravel app.

Step 2

Copy following class in to app/Socket folder and rename it to SocketIO.php

https://github.com/psinetron/PHP_SocketIO_Client

There are many PHP socket IO client is available but we used above one. You can choose either one of your choice.

Step 3

Connect and emit to socket. In your controller file where you want to emit the event. Add following code.

$socketIO = new SocketIO();
$returnValue = $socketIO->send('YOUR_URL', YOUR_PORT, 'YOUR_EVENT',json_encode(YOUR_PHP_ARRAY))

For this add following line to top of your controller.

use App\socket\SocketIO;

That's it and now you can connect with socket and emit event to it.

Socket.io Not Working on Android 9 (API 28)

Hi,

Recently in one of the project we faced a situation where we have used socket.io on backend and Android app connects to it. Socket.io was using http protocol for testing. It worked fine in older android versions but faced an issue in Android 9 and above where socket was connected but emit was not getting on server.

After couple of hours struggle finally found the problem. The problem was socket io was using http protocol and it's clearText HTTP request and it is banned in recent android version considering security reasons.

In earlier android version by default clearText is set as true but in later version default value is false. That means android components like HTTP and FTP and classes DownloadManager, and MediaPlayer can not use HTTP.

To over come this issue and allow socket to connect with HTTP protocol you have to allow clearText traffic on app level and for that you have to add following attribute in Application tag of your AndroidManifest.xml

<application
        android:usesCleartextTraffic="true">
.....
</application>

Once you add this to your manifest file, your socket emit will start working and you can still use HTTP with your socket.

Please note that since it was testing app we used HTTP based socket. However in production you should always use HTTPs protocol.

Hope this helps you.