Skip to content

Upgrade from 2.0.0 beta.3 to 2.0.0

Christian Memije edited this page Jan 10, 2019 · 18 revisions

Follow these steps to upgrade to Covalent 2.0.0:

  • Go here https://update.angular.io and upgrade to Angular 7 as needed by Covalent 2.0.0
    • Select Angular version upgrade from 6.0 (which Covalent 2.0.0-beta.3 is using) to 7.0 (which Covalent 2.0.0 is using)
    • Select other options respective of your projects configuration
    • Complete all the steps indicated
  • Upgrade the Covalent packages respective of yarn/npm tooling to:
"@covalent/core": "2.0.0",
"@covalent/dynamic-forms": "2.0.0",
"@covalent/highlight": "2.0.0",
"@covalent/http": "2.0.0",
"@covalent/markdown": "2.0.0",
  • Resolve Covalent specific breaking changes listed below

Fix Covalent breaking change (1/4):

We are favoring our pre-canned animations instead of the directives. The migration steps are the following:

Before:

<div [tdToggle]="boolean">
<div [tdFade]="boolean">

After:

typescript:

import { tdCollapseAnimation, tdFadeInOutAnimation } from '@covalent/core/common'
...
  animations: [ tdCollapseAnimation, tdFadeInOutAnimation ],
})

html:

<div [@tdCollapse]="boolean">
<div [@tdFadeInOut]="boolean">

Fix Covalent breaking change (2/4):

There are major changes with our http module since @angular/http will be removed soon from the angular framework so we are moving to @angular/common/http.

If you still want to keep using the deprecated version of http that uses @angular/http, you can do so by installing @covalent/http-deprec.

Before:

import { HttpInterceptorService, CovalentHttpModule } from '@covalent/http';

After:

import { HttpInterceptorService, CovalentHttpModule } from '@covalent/http-deprec';

Our new http module has a different usage and uses @angular/common/http under the covers.


Fix Covalent breaking change (3/4):

Remove deprecated animation functions. Function animations will no longer be part of covalent, please use the animation constants moving forward. This applies to all Covalent animation helpers, not just the example below.

Before:

TdCollapseAnimation()

After:

tdCollapseAnimation

Additional Usage info here


Fix Covalent breaking change (4/4):

With the new multi input in td-expansion-panel-group, the expansions will be accordion by default ([multi]="false"). So if you want to keep the same behavior, please add multi as an input.

Before:

<td-expansion-panel-group>

After:

<td-expansion-panel-group multi>