Running ionic-v1 with ionic-6 CLI
This is Chapter 2 of the series on Migrating an ionic-v1 app to ionic-react
In the previous chapter, we talked about our decision to migrate our ionic-v1 app to ionic-react. We had stopped development on the v1 app a while back, though it was deployed in App Store and Play Store and being used by our customers.
Since we were reusing the designs and functionality, the first step was to run the v1 app on our systems. Now, pretty much all software get updated at least once a year, if not more times. This meant, our development environment today did not match the one in which we had done our v1 development at all! The software we are talking about are
- OS version
- Node version
- Node modules and their versions
Since we were not planning to use cordova or run the app in simulator (or device), cordova and related plugin versions were not our worry.
We discovered that the node (or to be precise npm) version we had used then was so old that we did not have a package-lock.json checked in!
Being a simple business app, we did not have many third-party dependencies. It was mostly gulp, bower and related dependencies. An excerpt below:
On a newly cloned repo on a Mac running MacOS Catalina and the latest node LTS version (12.x) , the first step was to run
The installation failed with an error
gulp-sass version was too old! So, the logical next step was to update the
gulp-sassversion. Updating it from
^3.0.0 resulted in
npm install going through fine.
The next step was to run
Ah, the latest CLI does not know that this is indeed an ionic project! Why? Because the CLI relies on the file
ionic.config.json to know the type of ionic project that we have and this file is not present! We have the older
ionic.project file. So we followed the instructions and ran
This asked for the project name, which we set to our existing project. It resulted in
ionic.config.json file being created in the root folder with just 3 lines:
So far so good. Now, we tried
ionic serve again.
Looks like we were missing a dependency —
@ionic/v1-toolkit. The CLI prompted to install it and on agreeing, installed it in
devDependencies and then proceeded to successfully start the server.
We now had our v1 app running. It was now time to get the ionic-react app going!
ionic.config.json now has a few additional lines — for the CLI to know what folders to watch!
Hats off to ionic for ensuring that even the latest CLI could run the oldest version of the framework!