Skip to main content

ionic serve for an Ionic 1.0 app with Ionic 4 CLI

I first used the Ionic framework in 2015 and it has come a long way since then and it is now up to version 4. My app, My Day To-Do is a native iOS app however it’s UI is powered by HTML5 and more importantly Ionic 1 which involves using the Ionic CLI when debugging it’s UI. Recently, I updated the Ionic CLI and that meant that I couldn’t run my Ionic 1 code the way I used to. Hence In this post, I will share my solution of how to run Ionic 1 code base with the latest Ionic CLI i.e. 4.10.3.

Problem

After updating the Ionic CLI to 4.10.3 the first error I got when trying to debug my app UI using ionic serve was,
[WARN] Could not determine project type (project config: .\ionic.config.json).
The next error was
Error: ENOENT: no such file or directory, open ‘DirectoryPath\package.json’

Solution

To solve this problem, what I had to do was to create a new blank project with the latest Ionic CLI and simply copied those files from there as follows
  1. Start a new project with ionic start newApp tabs –type=ionic1  (Remember we need to create an Ionic 1 app)
  2. Open newApp/ionic.config.json and change the name property to the name of your app
  3. Copy the ionic.config.json file to your project directory which has the Ionic 1 wwwdirectory e.g. for My Day To-Do, the structure is mydaytodo/iOSFiles/  mydaytodo/www/ so I copied the ionic.config.json to mydaytodo/
  4. Copy the newApp/package.json  to the project directory as well which in my case would be mydaytodo/
  5. Next run the npm install command in the directory, what this will do is install some of the devDependancies defined in the package.json file
Once you have copied all those files, execute the ionic serve command on your console and your old project should run.
Now one more thing, one more thing before we wrap up this post. Once you run the ionic serve command after following the above steps, you may also see another error
Error: Cannot find module ‘DirectoryName/gulpfile.js’
As before to solve this, simply copy the gulpfile.js from the newApp directory generated before and that should solve your problem.
Lastly, remember you need to generate a new Ionic project using the command
ionic start newApp tabs –type=ionic1  
Hope this helps anyone coming up against this hurdle, like I did.

Some useful links

As usual, if you find any of my posts useful and want to support me, buy or even try one of our products and leave us a review on the app store.
My Day To-Do - Smart Task List
DownloadQR-Code
My Day To-Do - Smart Task List
Developer: Bhuman Soni
Price: $2.99
My Day To-Do Lite - Task list
DownloadQR-Code
My Day To-Do Lite - Task list
Developer: Bhuman Soni
Price: Free+
Snap! I was there
DownloadQR-Code
Snap! I was there
Developer: Bhuman Soni
Price: Free

Labels:

Comments

Post a Comment

Popular posts from this blog

Upload to AWS S3 from Java API

In this post, you will see code samples for how to upload a file to AWS S3 bucket from a Java Spring Boot app. The code you will see here is from one of my open-source repositories on Github, called document-sharing. Problem Let’s say you are building a document sharing app where you allow your users to upload the file to a public cloud solution. Now, let’s say you are building the API for your app with Spring Boot and you are using AWS S3 as your public cloud solution. How would you do that? This blog post contains the code that can help you achieve that. Read more below,  Upload to AWS S3 bucket from Java Spring Boot app - My Day To-Do (mydaytodo.com)
Post a Comment
Read more

Addressing app review rejections for auto-renewing subscription in-app purchase (iOS)

The ability to know what the weather is like while planning your day is a feature of  My Day To-Do  Pro and as of the last update it’s also a part of the  Lite version . Unlike the Pro version it’s an auto-renewing subscription based  in-app purchase (IAP)  in the Lite version. What means is that when a user purchases it, the user only pays for the subscription duration after which the user will be automatically charged for the next period. Adding an  auto-renewing  subscription based IAP proved to be somewhat challenging in terms of the app store review i.e. the app update was rejected by the App Review team thrice because of missing information about the IAP. Therefore in this post I will share my experiences and knowledge of adding auto-renewing IAP in hopes to save someone else the time that I had to spend on this problem. In-App purchase This year I started adding IAPs to My Day To-Do Lite which lead to learning about different types of IAP...
1 comment
Read more

Serving HTML content in an iOS app that works in iOS 7 and later (using Swift)

As I have mentioned in an earlier post , I really enjoying coding in Swift. Now what am I doing with it? Well I am trying to build an HTML5 app that must work on devices with iOS 7. So in iOS8 apple has introduced a whole bunch of features that facilitate easy communication between web content and lets just call it back-end Swift code, but those features are not in iOS 7. So why do I want to build something that would work in an older OS? well I do not expect existing iOS users to upgrade to iOS 8 straight away and i also know a couple of people who would be very reluctant to upgrade their iPhones to iOS 8. Now in case you do not, you can have a read of the "Working with WebViews" section of this post , to know how to serve HTML content with WebViews. So when I started building my app, I wanted to know: How do I invoke some Swift code from my HTML content? Well the solution to this may feel a little bit "hacky" but it is a solution to achieve this.  The followi...
Post a Comment
Read more