DEV Community

Cover image for Ember upgrade v3.x to 4.x
Raj Kishor
Raj Kishor

Posted on

Ember upgrade v3.x to 4.x

A dev journey of Ember upgrade from v3.20 to 4.8

Every aspiring dev journey starts from documentation, a bunch of documentations.

Upgrade guide:

Deprecation guide:

Release guide:

RFCs guide: Checkout to know more about behind the curtain of a deprecation


Upgrading a project is very ambitious task, and like every ambitious task let's break into small tasks.

Upgrade Plan

  • Sequential upgrade LTS wise.
  • Handle deprecation of only upgraded LTS.

How to upgrade?

Step 1: Upgrade ember-cli [as eg. 3.24.0 to 3.28.0]

  $ npm install -g ember-cli-update

  $ npm uninstall -g ember-cli
  $ npm install -g ember-cli@3.28.0
  $ ember --version
Enter fullscreen mode Exit fullscreen mode

Step 2: Navigate to project path in terminal

$ cd <project-path>
$ ember-cli-update --to 3.28.0
Enter fullscreen mode Exit fullscreen mode

This will update the project to the mentioned Ember CLI version. It will only modify the files if there are changes between your project's version and the latest version, and it will only change the section necessary, not the entire file.

You will probably encounter merge conflicts, in which the default behavior is to let you resolve conflicts on your own.

Step 3: Run your project to checkout any breakage [Project dependant]

Project third party packages can be upgraded while or even after upgrade of ember-cli, depends on project and type of breakage.

Detailed Ref: https://cli.emberjs.com/release/basic-use/upgrading


How to handle deprecation?
Step 1: Install ember-cli-deprecation-workflow in project

$ npm install ember-cli-deprecation-workflow --dev
Enter fullscreen mode Exit fullscreen mode

Step 2: create config/deprecation-workflow.js
Step 3: Add deprecation message entries as per documentation

Dev note: Handling and maintenance of deprecation in large project becomes tedious, this is how I handled one deprecation/version-wise at a time.
Github link: https://github.com/rajforum/ember-upgrade-note/blob/main/deprecation-wokflow.js

Change handler to log to list deprecations and throw once fixed.


TLDR tip:


A mention to other Refs which has helpful at very first upgrade.

Top comments (1)

Collapse
 
namaste_raj profile image
Raj Kishor

Ember has deprecated toJSON for ember-data/model. But we can achieve the same now.

toJSON() {
    return this.store.serializerFor('application').serialize(this._createSnapshot());
}
Enter fullscreen mode Exit fullscreen mode