Skip to content

Commit 4082cd2

Browse files
authored
fix(pgb-migration): add details for non-ionic apps (ionic-team#1436)
1 parent 0169bcd commit 4082cd2

1 file changed

Lines changed: 59 additions & 8 deletions

File tree

‎src/pages/appflow/cookbook/phonegap-build-migration.md‎

Lines changed: 59 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -130,14 +130,6 @@ The config.xml file might need some additional changes in order to function corr
130130

131131
Finally, you will want to make sure that whatever Cordova plugins you are using are the latest version to ensure compatibility with the current version of Cordova.
132132

133-
### Migrate the Code
134-
135-
Now that we have our icons, splash screens, and config.xml in place, we can turn our attention to the actual app itself. Ionic Appflow expects the entire app to be inside of a directory named `www`. That's it. Create that directory then move all app files into it, including HTML, CSS, JavaScript, images and any other related resources.
136-
137-
Here is what the app’s directory structure should look like:
138-
139-
![App Structure](/docs/assets/img/appflow/cookbook/app_structure.png)
140-
141133
### Set up a Git Repository
142134

143135
> If you already have your app in a Git repository, you can skip this section.
@@ -174,6 +166,65 @@ There are a variety of ways to add your local repository to their sites, but ult
174166
$ git push origin master
175167
```
176168

169+
### Create package.json and Ionic config files
170+
171+
> If you do not have Node or npm installed on your computer, you will need to do this before proceeding. If you need to install Node, please select the [current LTS version](https://nodejs.org).
172+
173+
Since Ionic Appflow was originally created to automate builds for Ionic apps, it requires two files that your app may not have. First, create a `package.json` file. The easiest way to create it is to run:
174+
175+
```bash
176+
$ npm init
177+
```
178+
179+
Answer all the prompts, including package name, version, and description. For `git repository`, enter the path configured in the previous step. The `entry point: (index.js)` can be set to anything since it won't be used.
180+
181+
```json
182+
{
183+
"name": "my-app",
184+
"version": "1.0.0",
185+
"description": "my cordova app",
186+
"main": "index.js",
187+
"scripts": {
188+
"test": "test"
189+
},
190+
"repository": {
191+
"type": "git",
192+
"url": "git+https://myorg@bitbucket.org/teamname/my-app.git"
193+
},
194+
"author": "My Name",
195+
"license": "ISC",
196+
"homepage": "https://myhomepage.com"
197+
}
198+
```
199+
200+
Next, create a new file at the root of the project - `ionic.config.json`. Copy in the following, changing only the `name` for your app:
201+
202+
```json
203+
{
204+
"name": "my-app",
205+
"type": "custom",
206+
"integrations": {
207+
"cordova": {}
208+
}
209+
}
210+
```
211+
212+
Finally, commit the new files to your project:
213+
214+
```bash
215+
$ git add .
216+
$ git commit -m "added package json and ionic config"
217+
$ git push
218+
```
219+
220+
### Migrate the Code
221+
222+
Now that we have our icons, splash screens, config.xml, and new required Appflow files in place, we can turn our attention to the actual app itself. Ionic Appflow expects the entire app to be inside of a directory named `www`. That's it. Create that directory then move all app files into it, including HTML, CSS, JavaScript, images and any other related resources.
223+
224+
Here is what the app’s directory structure should look like:
225+
226+
![App Structure](/docs/assets/img/appflow/cookbook/app_structure.png)
227+
177228
## Appflow Configuration
178229

179230
With your app ready for Appflow integration, it’s time to sign up, link your Git repository, then build the native iOS and Android versions. Begin by [signing up for an Appflow account](https://dashboard.ionicframework.com).

0 commit comments

Comments
 (0)