Creates .env.example file on boostrap

.gitignore

@@ -2,4 +2,6 @@ node_modules
 .vscode
 .DS_STORE
 public
-.cache
+.cache
+.env
+.env.*

Readme.md

@@ -14,26 +14,12 @@ npm i gatsby-plugin-appsync
 
 ## Usage
 
-Create an environment variable file which holds config params inside the root of your project
+Rename **.env.example.** on the root of your project to your **.env.[stage-name]** and replace variables to your own.
 
-**.env.[stage-name]**
-
-e.g
+For example,
 
 .env.development
 
-```yaml
-AWS_REGION=eu-west-2
-COGNITO_USER_POOL_ID=
-COGNITO_APP_CLIENT_ID=
-COGNITO_IDENTITY_POOL_ID=
-AUTH_TYPE=API_KEY # AWS_IAM, AMAZON_COGNITO_USER_POOLS, OPENID_CONNECT
-AUTH_API_KEY=12345 # if using API_KEY
-GRAPHQL_ENDPOINT=<AppSync GraphQL Endpoint>
-S3_BUCKET_URL=<S3 Bucket URL>  # Required for s3 uploads using complexObjectsCredentials
-S3_MAX_ATTACHMENT_SIZE=2000000
-```
-
 Add plugin in gatsby-config.js
 
 **Usage with react hooks but no offline support yet**
@@ -49,7 +35,7 @@ module.exports = {
 
 Same usage applies as using the latest version of React Apollo ( v 3+), with hooks.
 
-e.g
+For example,
 
 ```js
 import { useQuery, useLazyQuery } from "@apollo/react-hooks";
@@ -79,7 +65,7 @@ module.exports = {
 
 Since NPM drop in replacement was used to alias both apollo-client@2.6.4 and react-apollo@2.5.6 for offline support and cold install, Queries, Mutations or Subscriptions can then be imported using the hint below
 
-e.g
+For example,
 
 ```js
 import { Query, Mutation, Subscription, graphql } from "react-apollo-legacy";

gatsby-node.js

@@ -1,6 +1,32 @@
 const fs = require("fs");
 const path = require("path");
 
+const nodeEnv = process.env.NODE_ENV;
+
 const config = require("dotenv").config({
-  path: `.env.${process.env.NODE_ENV}`
+  path: `.env.${nodeEnv}`
 });
+
+exports.onPreBootstrap = ({ reporter }) => {
+  const envString = `
+    GATSBY_AWS_REGION=eu-west-2
+    GATSBY_COGNITO_USER_POOL_ID=
+    GATSBY_COGNITO_APP_CLIENT_ID=
+    GATSBY_COGNITO_IDENTITY_POOL_ID=
+    GATSBY_AUTH_TYPE=API_KEY
+    GATSBY_AUTH_API_KEY=12345
+    GATSBY_GRAPHQL_ENDPOINT=http://localhost:4000/graphql
+    GATSBY_S3_BUCKET_URL=
+    GATSBY_S3_MAX_ATTACHMENT_SIZE=2000000
+  `;
+
+  const currEnv = path.join(__dirname, `.env.${nodeEnv}`);
+  const envPath = path.join(__dirname, `.env.example`);
+
+  if (!fs.existsSync(currEnv)) {
+    reporter.info(
+      "Ensure to create an env.[stage-name] using .env.example as a format"
+    );
+    fs.createWriteStream(envPath).write(envString);
+  }
+};

src/client-offline.js

@@ -1,28 +1,28 @@
 import React from "react";
 import { ApolloProvider } from "react-apollo-legacy";
 import AWSAppSyncClient from "aws-appsync";
-import Rehydrated from "./rehydrate";
-
 import Auth from "@aws-amplify/auth";
 
+import Rehydrated from "./rehydrate";
+
 Auth.configure({
-  region: process.env.AWS_REGION,
-  userPoolId: process.env.COGNITO_USER_POOL_ID,
-  identityPoolId: process.env.COGNITO_IDENTITY_POOL_ID,
-  userPoolWebClientId: process.env.COGNITO_APP_CLIENT_ID
+  region: process.env.GATSBY_AWS_REGION,
+  userPoolId: process.env.GATSBY_COGNITO_USER_POOL_ID,
+  identityPoolId: process.env.GATSBY_COGNITO_IDENTITY_POOL_ID,
+  userPoolWebClientId: process.env.GATSBY_COGNITO_APP_CLIENT_ID
 });
 
-const url = process.env.GRAPHQL_ENDPOINT;
-const region = process.env.AWS_REGION;
+const url = process.env.GATSBY_GRAPHQL_ENDPOINT;
+const region = process.env.GATSBY_AWS_REGION;
 
 const auth =
   process.env.AUTH_TYPE === "API_KEY"
     ? {
-        type: process.env.AUTH_TYPE,
-        apiKey: process.env.AUTH_API_KEY
+        type: process.env.GATSBY_AUTH_TYPE,
+        apiKey: process.env.GATSBY_AUTH_API_KEY
       }
     : {
-        type: process.env.AUTH_TYPE,
+        type: process.env.GATSBY_AUTH_TYPE,
         credentials: () => Auth.currentCredentials()
       };
 

src/client.js

@@ -12,14 +12,14 @@ import { InMemoryCache } from "apollo-cache-inmemory";
 import Auth from "@aws-amplify/auth";
 
 Auth.configure({
-  region: process.env.AWS_REGION,
-  userPoolId: process.env.COGNITO_USER_POOL_ID,
-  identityPoolId: process.env.COGNITO_IDENTITY_POOL_ID,
-  userPoolWebClientId: process.env.COGNITO_APP_CLIENT_ID
+  region: process.env.GATSBY_AWS_REGION,
+  userPoolId: process.env.GATSBY_COGNITO_USER_POOL_ID,
+  identityPoolId: process.env.GATSBY_COGNITO_IDENTITY_POOL_ID,
+  userPoolWebClientId: process.env.GATSBY_COGNITO_APP_CLIENT_ID
 });
 
-const url = process.env.GRAPHQL_ENDPOINT;
-const region = process.env.AWS_REGION;
+const url = process.env.GATSBY_GRAPHQL_ENDPOINT;
+const region = process.env.GATSBY_AWS_REGION;
 
 const onErrorLink = onError(({ graphQLErrors, networkError }) => {
   if (graphQLErrors)
@@ -37,11 +37,11 @@ const onErrorLink = onError(({ graphQLErrors, networkError }) => {
 const auth =
   process.env.AUTH_TYPE === "API_KEY"
     ? {
-        type: process.env.AUTH_TYPE,
-        apiKey: process.env.AUTH_API_KEY
+        type: process.env.GATSBY_AUTH_TYPE,
+        apiKey: process.env.GATSBY_AUTH_API_KEY
       }
     : {
-        type: process.env.AUTH_TYPE,
+        type: process.env.GATSBY_AUTH_TYPE,
         credentials: () => Auth.currentCredentials()
       };