-
Notifications
You must be signed in to change notification settings - Fork 358
Upgrade from 2.0.0 beta.3 to 2.0.0
Follow these steps to upgrade to Covalent 2.0.0:
- Visit the Angular Upgrade Guide to upgrade to Angular 7
- Select Angular version upgrade from
6.0
(which Covalent 2.0.0-beta.3 is using) to7.0
(which Covalent 2.0.0 is using) - Select other options respective of your projects configuration
- Complete all the steps indicated
- Select Angular version upgrade from
- Upgrade the Covalent packages applicable to your project to their new versions:
"@covalent/code-editor": "2.0.2",
"@covalent/core": "2.0.0",
"@covalent/dynamic-forms": "2.0.0",
"@covalent/echarts": "2.0.0",
"@covalent/flavored-markdown": "2.0.0",
"@covalent/highlight": "2.0.0",
"@covalent/http": "2.0.0",
"@covalent/markdown": "2.0.0",
"@covalent/text-editor": "2.0.0",
- Resolve Covalent specific breaking changes listed below
Breaking change #1: http:
Since @angular/http
will soon be deprecated, the implementation of @covalent/http
was changed to use @angular/common/http
under the covers.
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';
Breaking change #2: td-expansion-panel-group:
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>
Breaking change #3: Animation directives:
We are favoring our pre-canned animations instead of the directives. This applies to all Covalent animations, not just the examples below.
Before:
<div [tdToggle]="boolean">
<div [tdFade]="boolean">
After:
import { tdCollapseAnimation, tdFadeInOutAnimation } from '@covalent/core/common'
...
animations: [ tdCollapseAnimation, tdFadeInOutAnimation ],
})
<div [@tdCollapse]="boolean">
<div [@tdFadeInOut]="boolean">
Breaking change #4: Animation functions:
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 animations, not just the example below.
For example:
Before:
TdCollapseAnimation()
After:
tdCollapseAnimation
Additional Usage info here