{"id":19665515,"url":"https://github.com/geeklearningio/gl-ionic2-env-configuration","last_synced_at":"2025-04-28T22:31:14.277Z","repository":{"id":69663305,"uuid":"76945721","full_name":"geeklearningio/gl-ionic2-env-configuration","owner":"geeklearningio","description":"An Ionic2 Service to load an environment specific configuration before everything else","archived":false,"fork":false,"pushed_at":"2017-09-28T06:57:10.000Z","size":1042,"stargazers_count":24,"open_issues_count":4,"forks_count":3,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-21T14:56:35.326Z","etag":null,"topics":["configuration","configuration-loader","ionic","ionic2"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/geeklearningio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-12-20T10:08:16.000Z","updated_at":"2023-07-04T15:24:19.000Z","dependencies_parsed_at":"2023-06-09T03:30:37.159Z","dependency_job_id":null,"html_url":"https://github.com/geeklearningio/gl-ionic2-env-configuration","commit_stats":{"total_commits":18,"total_committers":2,"mean_commits":9.0,"dds":0.05555555555555558,"last_synced_commit":"b6f33bf62269f292ed17a28de7387496e90bba59"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/geeklearningio%2Fgl-ionic2-env-configuration","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/geeklearningio%2Fgl-ionic2-env-configuration/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/geeklearningio%2Fgl-ionic2-env-configuration/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/geeklearningio%2Fgl-ionic2-env-configuration/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/geeklearningio","download_url":"https://codeload.github.com/geeklearningio/gl-ionic2-env-configuration/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251397577,"owners_count":21583034,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["configuration","configuration-loader","ionic","ionic2"],"created_at":"2024-11-11T16:23:10.131Z","updated_at":"2025-04-28T22:31:12.418Z","avatar_url":"https://github.com/geeklearningio.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Introduction\nThis is an environment configuration package for Ionic2.\nIt allows you to dynamically load a json configuration file at the root of your app (www). \nThis json will be loaded before everything else in your App.\n\n# Usecase\nFor example, in a continuous integration system, we often need different API endpoints between developpment, preproduction, production and so on.\nThis system will allow you to change this kind of parameter in the configuration file without having to recompile your Typescript code all over.\n\n# Example\nTo make it simpler, this repository contains a `test-app` folder which follows the \"How to use it section\". \nSo if you prefer reading the code, go ahead!\n\n# How to use it\n\n## Install the module\nInstall it with npm:\n```\nnpm install gl-ionic2-env-configuration --save\n```\n\n## Create or copy your configuration json file\n\n### Simple way\nAdd a `env-configuration.json` file in your `www` folder containing your env configuration variables.\nThere is no required key needed, it's your configuration. It will surely contain your api url, your Google Analytics ID and more...\nTo copy the right configuration for the right environment, you will need a copy executable, as explained in the next section.\n\n### Automatic way (use a copy executable)\nI made a simpe executable that will copy the right configuration file for a specified environment:\n`copy-env-config.js` which is available [here](https://github.com/geeklearningio/gl-ionic2-env-configuration/blob/master/test-app/copy-env-config.js).\n\nHere how to use it:\n```\nnode copy-env-config.js --env YOURENV\n```\nThis will copy the file `src/env-configuration/YOURENV.json` to `www/env-configuration.json`\n\n### Even more automatic\nJust run this command before your ionic:serve or ionic:build command to specify the right environment configuration to copy.\nFor example, to build you app in prod and serve in dev, just update your `package.json` scripts like that:\n```\n\"ionic:build\": \"node copy-env-config.js --env prod | ionic-app-scripts build\",\n\"ionic:serve\": \"node copy-env-config.js --env dev | ionic-app-scripts serve\"\n```\n\n## Use the module in your Ionic 2 app\n\n```typescript\nimport { NgModule } from '@angular/core';\nimport { IonicApp, IonicModule } from 'ionic-angular';\nimport { MyApp } from './app.component';\nimport { HomePage } from '../pages/home/home';\n\n// Import the module\nimport { GLIonic2EnvConfigurationModule } from 'gl-ionic2-env-configuration';\n\n@NgModule({\n  declarations: [\n    MyApp,\n    HomePage\n  ],\n  imports: [\n    IonicModule.forRoot(MyApp),\n\n    GLIonic2EnvConfigurationModule // Import the module here\n  ],\n  bootstrap: [IonicApp],\n  entryComponents: [\n    MyApp,\n    HomePage\n  ],\n  providers: []\n})\nexport class AppModule {}\n```\n\n## Get the configuration in your app\n\n```typescript\nimport { Component } from '@angular/core';\n\n// Import the module\nimport {EnvConfigurationProvider} from \"gl-ionic2-env-configuration\";\n\n// Import your configuration typings\n// You can specify a typing for your configuration to get nice and neat autocompletion\nimport {ITestAppEnvConfiguration} from \"../../env-configuration/ITestAppEnvConfiguration\";\n\n@Component({\n  selector: 'page-home',\n  templateUrl: 'home.html'\n})\nexport class HomePage {\n\n  // inject the EnvConfigurationProvider and specify the configuration typings\n  constructor(private envConfiguration: EnvConfigurationProvider\u003cITestAppEnvConfiguration\u003e) {\n    let config: ITestAppEnvConfiguration = envConfiguration.getConfig();\n    console.log(config); // And here you have your nice configuration\n  }\n\n}\n```\n\n## How it works\nThis modules uses a specific way to load the `EnvConfigurationProvider` which basically tells Angular to wait for this provider to load the configuration json file before loading the rest.\nSo for example, your API service will have the right endpoint even in its constructor.\n\nTo learn more about this specific loading, you can see this [discussion](https://github.com/angular/angular/issues/9047#issuecomment-224075188) and this [GIST file](https://gist.github.com/fernandohu/122e88c3bcd210bbe41c608c36306db9).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgeeklearningio%2Fgl-ionic2-env-configuration","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgeeklearningio%2Fgl-ionic2-env-configuration","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgeeklearningio%2Fgl-ionic2-env-configuration/lists"}