Skip to content

Example Ionic v2 project

Lorenzo Pichilli edited this page Dec 30, 2017 · 6 revisions

Create a new Ionic v2 project (for this type of project, I advice you to install the TypeScript plugin in order to work with typescript files, because Flow wont work on this kind of files). After choosing the project path and your ionic custom path (ionic is the default value used), you will have something like that view:

I'm choosing the blank template and the integration with Cordova, so I will get something like that:

At the end of the process, Sublime Text will open your new project.

As you can see, in the .je-project-settings there is another setting file: ionicv2_settings.json, that contains:

{
  "cli_custom_path": "ionic", 
  "working_directory": "/Users/lorenzo/Desktop/project_test", 
  "platform_prepare_options": {}, 
  "platform_emulate_options": {
    "debug": {}, 
    "release": {}
  }, 
  "platform_compile_options": {
    "debug": {}, 
    "release": {}
  }, 
  "platform_build_options": {
    "debug": {}, 
    "release": {}
  }, 
  "platform_run_options": {
    "debug": {}, 
    "release": {}
  }, 
  "serve_options": []
}

"platform_prepare_options" and the "debug" "release" keys of "platform_emulate_options", "platform_compile_options", "platform_build_options", "platform_run_options" could contain custom option relative a specific platform (ios, android, firefoxos, blackberry10, osx, etc.), for example:

{
  "cli_custom_path": "ionic", 
  "working_directory": "/Users/lorenzo/Desktop/project_test", 
  "platform_prepare_options": {
    "ios": ["--no-build"],
    "android": ["--minifyjs", "--minifycss"]
  }, 
  "platform_emulate_options": {
    "debug": {}, 
    "release": {}
  }, 
  "platform_compile_options": {
    "debug": {}, 
    "release": {}
  }, 
  "platform_build_options": {
    "debug": {
      "ios": ["--buildConfig"],
      "android": ["--device", "--optimizejs"]
    }, 
    "release": {
      "ios": ["--prod", "--", "--developmentTeam=\"ABCD\"", "--codeSignIdentity=\"iPhone Developer\"", "--packageType=\"app-store\""],
      "android": ["--prod", "--", "--", "--minSdkVersion=21", "--keystore=filename.keystore", "--alias=myalias"]
    }
  }, 
  "platform_run_options": {
    "debug": {
      "ios": ["--livereload", "--consolelogs", "--target=\"iPhone-6, 11.2\""],
      "android": ["--livereload", "--consolelogs"]
    }, 
    "release": {
      "ios": ["--livereload", "--consolelogs", "--target=\"iPhone-6, 11.2\""],
      "android": ["--livereload", "--consolelogs"]
    }
  }, 
  "serve_options": ["-c", "--browser", "firefox"]
}
  • "cli_custom_path": is the custom path for ionic cli used by the plugin when calling its commands
  • "working_directory": is the working directory of the ionic cli
  • "platform_prepare_options": contains custom parameters that must be appended every time when calling the prepare command.
  • "platform_emulate_options": contains custom parameters that must be appended every time when calling the emulate command.
  • "platform_compile_options": contains custom parameters that must be appended every time when calling the compile command.
  • "platform_build_options": contains custom parameters that must be appended every time when calling the build command.
  • "platform_run_options": contains custom parameters that must be appended every time when calling the run command.
  • "serve_options": contains custom parameters that must be appended every time when calling the serve command.

These options will be used when you click the menu options that offers Ionic v2 menu, under the Tools menu:

For example, by clicking the "Run" > "Debug" menu option and using the "platform_run_options" setted before, before execute the command, we will prompt to insert the platform requested:

then it will execute the command ionic cordova run ios --debug --livereload --consolelogs --target="iPhone-6, 11.2", so we will get something like that:

In that way you will be able to code and monitor in real-time and in the same view your ionic application:

That example is similar for Ionic v1 and Cordova projects.