trainer configuration to ENV

Author: xpepermint

README.md

@@ -13,7 +13,7 @@ If you haven't done it already, checkout the [hands-on Learn Apollo tutorial](ht
 ```sh
 cd playground
 yarn install
-yarn dev # open localhost:4000
+TRAINER_NAME='{your-name}' TRAINER_ID="{your-id}" yarn dev
 ```
 
 ## Workflow

playground/package.json

@@ -3,7 +3,7 @@
   "description": "A Pokedex App using and teaching Apollo and Vue.js",
   "private": true,
   "scripts": {
-    "dev": "vue build src/index.js"
+    "dev": "vue build src/index.js --config ./vue.config.js"
   },
   "dependencies": {
     "apollo-client": "^0.5.0",

playground/src/config/index.js

@@ -1,2 +1,2 @@
-export const trainerName = 'Kristijan Sedlak';
-export const trainerId = 'ciyg03gv6kjp30164zo6u8jn2';
+export const trainerName = process.env.TRAINER_NAME;
+export const trainerId = process.env.TRAINER_ID;

playground/vue.config.js

@@ -0,0 +1,17 @@
+const webpack = require('webpack');
+
+module.exports = {
+
+  webpack (defaults) {
+    defaults.plugins.push(
+      new webpack.DefinePlugin({
+        'process.env': {
+          'TRAINER_NAME': JSON.stringify(process.env.TRAINER_NAME),
+          'TRAINER_ID': JSON.stringify(process.env.TRAINER_ID)
+        }
+      })
+    );
+    return defaults;
+  }
+
+};