Constructor of class 'HubConnection' is private and only accessible within the class declaration

I am trying to implement an Angular and Signalr project. I am getting the sample from Medium

I have installed all the necessary packages and have the code below in the app.component.ts:

import { Component, OnInit } from '@angular/core';
import { HubConnection } from '@aspnet/signalr';

import { Message } from 'primeng/api';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'PROJECT TITLE';
  base_url = 'http://localhost:8081/';

  hubConnecton: HubConnection;
  msgs: Message[] = [];

  constructor() { 
    
  }

  ngOnInit(): void {
    this.hubConnecton = new HubConnection(this.base_url);
  }
}

But I get an error in the = new HubConnection(this.base_url); with this message: Constructor of class 'HubConnection' is private and only accessible within the class declaration.

You have to use HubConnectionBuilder().

import { Component, OnInit } from '@angular/core';
import { HubConnection, HubConnectionBuilder } from '@aspnet/signalr';
import { Message } from 'primeng/api';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  public _hubConnecton: HubConnection;
  msgs: Message[] = [];

  constructor() { }

  ngOnInit(): void {
    this._hubConnecton = new HubConnectionBuilder().withUrl("http:/:localhost:1874/notify").build();
    this._hubConnecton
      .start()
      .then(() => console.log('Connection started!'))
      .catch(err => console.log('Error while establishing connection :('));

    this._hubConnecton.on('BroadcastMessage', (type: string, payload: string) => {
      this.msgs.push({ severity: type, summary: payload });
    });
  }
}