@ngx-universal/config-loader
v5.0.0
Published
Loader for ngx-config that provides application settings to browser/server platforms
Downloads
26
Maintainers
Readme
@ngx-universal/config-loader
Loader for ngx-config that provides application settings to browser/server platforms
Please support this project by simply putting a Github star. Share this library with friends on Twitter and everywhere else you can.
NOTICE
This 5.x.x branch is intented to work with
@angular v5.x.x
. If you're developing on a later release of Angular thanv5.x.x
, then you should probably choose the appropriate version of this library by visiting the master branch.
Table of contents:
Prerequisites
This library depends on Angular v4.0.0
. Older versions contain outdated dependencies, might produce errors.
Also, please ensure that you are using Typescript v2.5.3
or higher.
Getting started
Installation
You can install @ngx-universal/config-loader
using npm
npm install @ngx-universal/config-loader --save
Note: You should have already installed @ngx-config/core.
Examples
- ng-seed/universal is an officially maintained seed project, showcasing common patterns and best practices for
@ngx-universal/config-loader
.
Related packages
The following packages may be used in conjunction with @ngx-universal/config-loader
:
Adding @ngx-universal/config-loader
to your project (SystemJS)
Add map
for @ngx-universal/config-loader
in your systemjs.config
'@ngx-universal/config-loader': 'node_modules/@ngx-universal/config-loader/bundles/config-loader.umd.min.js'
Settings
Setting up ConfigModule
to use UniversalConfigLoader
UniversalConfigLoader
requires a browserLoader
and a serverLoader
to load application settings on both platforms.
- Import
ConfigModule
using the mapping'@ngx-config/core'
and appendConfigModule.forRoot({...})
within the imports property of app.module. - Import
UniversalConfigLoader
using the mapping'@ngx-universal/config-loader'
.
Note: Considering the app.module is the core module in Angular application.
config.json
{
"system": {
"applicationName": "Mighty Mouse",
"applicationUrl": "http://localhost:8000"
},
"seo": {
"pageTitle": "Tweeting bird"
},
"i18n":{
"locale": "en"
}
}
app.module.ts
...
import { ConfigModule, ConfigLoader, ConfigStaticLoader } from '@ngx-config/core';
import { ConfigFsLoader } from '@ngx-config/fs-loader';
import { ConfigHttpLoader } from '@ngx-config/http-loader';
import { UniversalConfigLoader } from '@ngx-universal/config-loader';
...
export function configFactory(platformId: any, http: HttpClient): ConfigLoader {
const serverLoader = new ConfigFsLoader('./public/assets/config.json'); // FILE PATH
const browserLoader = new ConfigHttpLoader(http, './assets/config.json'); // API ENDPOINT
return new UniversalConfigLoader(platformId, serverLoader, browserLoader);
}
@NgModule({
declarations: [
AppComponent,
...
],
...
imports: [
ConfigModule.forRoot({
provide: ConfigLoader,
useFactory: (configFactory),
deps: [PLATFORM_ID, Http]
}),
...
],
...
bootstrap: [AppComponent]
})
export class AppModule {
constructor(@Inject(PLATFORM_ID) private readonly platformId: any) {
}
}
UniversalConfigLoader
has two parameters:
- serverLoader:
ConfigLoader
: the loader which will run on theserver
platform (ex:ConfigFsLoader
, orConfigStaticLoader
) - browserLoader:
ConfigLoader
: the loader which will run on thebrowser
platform (ex:ConfigHttpLoader
, orConfigStaticLoader
)
:+1: Well!
@ngx-universal/config-loader
will now provide application settings to browser/server platforms.
License
The MIT License (MIT)
Copyright (c) 2018 Burak Tasci