Polymer / pwa-starter-kit

Starter templates for building full-featured Progressive Web Apps from web components.
https://pwa-starter-kit.polymer-project.org
2.36k stars 431 forks source link

How to configure a polymer 3 PWA starter app #318

Closed camstuart closed 5 years ago

camstuart commented 5 years ago

I am assuming that future versions of this starter will include an example of a configuration file. such as a json file that is selected dynamically based on NODE_ENV

A good example of a data that should be stored in a configuration file would be the base path of an API endpoint, such as the one used in this example:

https://github.com/PolymerLabs/books/blob/master/src/actions/books.js#L23

I am currently considering loading a json file in the main redux store, but it would be great to understand what direction this starter kit will take, so the solution I use is somewhat consistent with future revisions of this project

camstuart commented 5 years ago

For the moment, I have done the following:

npm install config
mkdir config
touch config/default.json config/index.js

In config/default.json

{
  "myApp": {
    "apiBaseURI": "http://localhost:9000"
  }
}

In config/index.js

import config from 'config'
const myAppConfig = config.get('myApp')
export default myAppConfig

See also: npm package documentation for other environments such as via NODE_ENV

And then in my various javascript files that need access to this configuration:

import myAppConfig from '../config'
...
fetch(`${myAppConfig.apiBaseURI}/my-endpoint`)

This seems like an idiomatic solution for javascript applications. But as I said, I would like to stay consistent with this starter-kit. Unless of course you adopt this approach :)

keanulee commented 5 years ago

Also see #307

No immediate plans to add configuration options ourselves, so feel free to use whatever works for your case.