🎉 - [react-environment-settings] Added sample content

samples/react-environment-settings/Scripts.ps1

@@ -0,0 +1,83 @@
+function Set-SPFxEnvironment {
+    [CmdletBinding()]
+    param ()
+    dynamicparam {
+
+        if (-not (Test-Path ".yo-rc.json")) {
+            Write-Host "No .yo-rc.json make sure you're in an active SPFx project!" -ForegroundColor Red;
+            return;
+        }
+
+        if (-not (Test-Path ".\src\settings")) {
+            Write-Host "No settings folder found, please setup first..." -ForegroundColor Yellow;
+            return;
+        }
+
+        $parameterAttribute = New-Object System.Management.Automation.ParameterAttribute
+        $parameterAttribute.ParameterSetName = "ParamsList"
+        $parameterAttribute.Mandatory = $true
+        $parameterAttribute.Position = 1
+        $parameterAttribute.ValueFromPipelineByPropertyName = $true
+            
+        $envrionemts = Get-ChildItem .\src\settings\ -Filter "settings.*.json" | ForEach-Object { $_.Name -replace "^settings\.(.*)\.json$", '$1' }
+        $parameterValidateSet = New-Object System.Management.Automation.ValidateSetAttribute -ArgumentList $envrionemts
+    
+    
+        $attributeCollection = New-Object Collections.ObjectModel.Collection[System.Attribute]
+        $attributeCollection.Add($parameterAttribute)
+        $attributeCollection.Add($parameterValidateSet)
+        $attributeCollection.Add($parameterValidateScript)
+    
+        $parameter = New-Object System.Management.Automation.RuntimeDefinedParameter -ArgumentList @("Environment", [string], $attributeCollection)
+    
+        $paramDictionary = New-Object -Type System.Management.Automation.RuntimeDefinedParameterDictionary
+        $paramDictionary.Add("Environment", $parameter)
+    
+        $paramDictionary
+    }
+    process {
+        # Do stuff here. The parameter we added can be found in $PSBoundParameters
+        Write-Host Switching to: $PSBoundParameters.Environment
+        $settingsFile = ".\src\settings\settings.$($PSBoundParameters.Environment).json"
+        New-Item ".\src\settings\settings.json" -ItemType File -Force -Value (Get-Content $settingsFile -Raw) | out-null
+    }
+}
+
+function Add-SPFxEnvrionmentSettings() {
+    if (-not (Test-Path ".yo-rc.json")) {
+        Write-Host "No .yo-rc.json make sure you're in an active SPFx project!" -ForegroundColor Red;
+        return;
+    }
+
+    if ((Test-Path ".\src\settings")) {
+        Write-Host "Settings folder found, cannot run setup twice..." -ForegroundColor Yellow;
+        return;
+    }
+
+    Write-Host "Creating settings folder..." -ForegroundColor Green;
+    New-Item ".\src\settings" -ItemType Directory -Force;
+
+    Write-Host "Creating settings files..." -ForegroundColor Green;
+    New-Item ".\src\settings\settings.d.ts" -ItemType File -Force -Value ("declare interface ISettings {
+    MessageOfTheDay: string;
+}
+
+declare module '*.settings' {
+    const settings: ISettings;
+    export = settings;
+}");
+    
+    New-Item ".\src\settings\settings.dev.json" -ItemType File -Force -Value ("{
+    ""MessageOfTheDay"": ""Test Message""
+}");
+
+    New-Item ".\src\settings\settings.prod.json" -ItemType File -Force -Value ("{
+    ""MessageOfTheDay"": ""Prod Message""
+}");
+
+
+    
+    $tsConfig = Get-Content -Path "tsconfig.json" -Raw | ConvertFrom-Json
+    Add-Member -InputObject ($tsConfig.compilerOptions) NoteProperty -Name "resolveJsonModule" -Value $true -Force;
+    $tsConfig | ConvertTo-Json -Depth 100 | Set-Content -Path "tsconfig.json"
+}

samples/react-environment-settings/src/settings/settings.d.ts

@@ -0,0 +1,8 @@
+declare interface ISettings {
+    MessageOfTheDay: string;
+}
+
+declare module '*.settings' {
+    const settings: ISettings;
+    export = settings;
+}

samples/react-environment-settings/src/settings/settings.dev.json

@@ -0,0 +1,3 @@
+{
+        "MessageOfTheDay": "Test Message"
+    }

samples/react-environment-settings/src/settings/settings.json

@@ -0,0 +1,3 @@
+{
+        "MessageOfTheDay": "Test Message"
+    }

samples/react-environment-settings/src/settings/settings.prod.json

@@ -0,0 +1,3 @@
+{
+        "MessageOfTheDay": "Prod Message"
+    }

samples/react-environment-settings/src/webparts/helloWorld/components/HelloWorld.tsx

@@ -1,11 +1,12 @@
 import * as React from 'react';
+import * as settings from '../../../settings/settings.json';
 
 export interface IHelloWorldProps { }
 
 export const HelloWorld: React.FunctionComponent<IHelloWorldProps> = (props: React.PropsWithChildren<IHelloWorldProps>) => {
   return (
     <>
-      Hello world
+      <b>Message of the day:</b> {settings.MessageOfTheDay}
     </>
   );
 };

samples/react-environment-settings/tsconfig.json

@@ -13,7 +13,6 @@
     "outDir": "lib",
     "inlineSources": false,
     "noImplicitAny": true,
-
     "typeRoots": [
       "./node_modules/@types",
       "./node_modules/@microsoft"
@@ -26,7 +25,8 @@
       "dom",
       "es2015.collection",
       "es2015.promise"
-    ]
+    ],
+    "resolveJsonModule": true
   },
   "include": [
     "src/**/*.ts",