Hybrid Mobile

Experiment on Ionic 2 Project Modular Structure

Suppose you already know about ionic 2, typescript, nodejs, NPM related or Webpack. I’ll some day back on those topics whenever available, of course, I am also a learner with few tries.

The subject of this guideline will be updated according to my real experiment, this is just a starter:

  • 1st of March, 2017: Start init
  • 4th of April, 2017: Node module generator

Let’s go to the topic…

You may need to have different projects and one core as a centralize project for most of your common methods.

Here is the normal ionic 2 with typescript project structure:

As in above, we need to have our own core-common project which is a npm module by theory and then in another project we need to include that module as dependency and of course, it’s a private dependency so the we may need to add as following way (via this ref):

 "name": "my-app",
 "dependencies": {
   "my-core-module": "file:local_modules/my-core-module",

And to create the npm module, I suggest to go through with the Yeoman Generator, es6-npm-module.

npm install -g yo generator-es6-npm-module
mkdir my-core-module && cd my-core-module
yo es6-npm-module

If using above generator, we need to add our own tsconfig.json and other typescript file to manage.
I found one generator is easy to use: Node-Typescript

npm install -g generator-node-typescript

mkdir my-new-project && cd my-new-project

yo node-typescript

I’ll let you know how my journey is.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.