How to rename Ionic app from HelloCordova
Ionic FrameworkIonic Framework Problem Overview
The Ionic framework is pretty great stuff. I was able to successfully build an app with some Angular code I have been working on, but I can't find an answer to the simple question of how to rename the app that gets generated. The output app is always called HelloCordova and there doesn't seem to be any documentation on how to change the name of the app. If I start manually digging through the project directory replacing HelloCordova, I end up with an app that won't run. Surely, people have solved this before.
Ionic Framework Solutions
Solution 1 - Ionic Framework
Edit: You want to change the config.xml file in your project's root directory.
The tag which is responsible for the app name is <name>.
look up the config documentation for more.
Solution 2 - Ionic Framework
Updated
- Change the name in config.xml (@ project root) see the : documentation.
- Execute this command : $ sudo ionic cordova platform remove ios
- Check if the folder ios under platforms folder is deleted.
- Execute this command : $ sudo ionic cordova platform add ios
Solution 3 - Ionic Framework
If changing the name is not working for any reason delete entire platform folder and then
cordova platform add ios
ionic build ios
Solution 4 - Ionic Framework
If your looking to change the iconic view name be sure to also update ionic.project
Solution 5 - Ionic Framework
Yes, you just have to modify the config.xml. Find a "name" tag and put your required name between this tag.
Solution 6 - Ionic Framework
The following steps will help you as it did to me.
-
Rename app name in config.xml
<name>Your_new_name</name> -
ionic cordova plugin save
-
ionic cordova rm ios
-
ionic cordova add ios
-
ionic cordova plugin add --save cordova-plugin-facebook4 --variable APP_ID="my_app_id" --variable APP_NAME="my_app_name" --variable CHANNEL_NAME="master"
Solution 7 - Ionic Framework
In the parent directory of the ionic project there is a config.xml
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.todo497320" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>CHANGE NAME HERE</name>
Note that the project name will be seen in various other places in the app, all these will be changed automatically when the app is built
Solution 8 - Ionic Framework
In the parent directory of the ionic project there is a config.xml
If changing the name is not working for any reason delete entire platform folder and then
cordova platform add ios ionic build ios
Solution 9 - Ionic Framework
You should make this change in the config.xml found at the root of your project. For example you might have something like this:
***<widget id="com.ionicframework.exampleproject223738" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">***
Change the id to whatever you wish your package to be and it will work for the entire project, Android and iOS.
However, if you've already submitted to the app store with a package name, you cannot change the package name at this point. Not unless you want to submit a new project. Updates must be made with matching package names.
Solution 10 - Ionic Framework
For ionic 4.5.0 the "ionic platform" command has been renamed and the following commands are not used anymore:
- ionic platform remove ios
- ionic platform add ios
Instead use:
- ionic cordova platform add ios
- ionic cordova platform remove ios
Note: ios or android depending on your case