fix: Fixes for placeholder mode (#16)

* Fixes for placeholder mode * chore: self mutation Signed-off-by: github-actions <[email protected]> * WIP * readme * index.html * index.html Signed-off-by: github-actions <[email protected]> Co-authored-by: github-actions <[email protected]>
jetbridge · Nov 9, 2022 · 1b75ab4 · 1b75ab4
1 parent 58c4b9d
commit 1b75ab4
Show file tree

Hide file tree

Showing 7 changed files with 54 additions and 43 deletions.
diff --git a/API.md b/API.md
diff --git a/README.md b/README.md
@@ -114,12 +114,12 @@ class NextjsSst extends Nextjs {
       nextjsPath: path.isAbsolute(props.nextjsPath) ? path.relative(app.appPath, props.nextjsPath) : props.nextjsPath,
     });
 
-    this.registerSiteEnvironment();
+    if (props.environment) this.registerSiteEnvironment(props.environment);
   }
 
-  protected registerSiteEnvironment() {
+  protected registerSiteEnvironment(environment: Record<string, string>) {
     const environmentOutputs: Record<string, string> = {};
-    for (const [key, value] of Object.entries(this.props.environment || {})) {
+    for (const [key, value] of Object.entries(environment)) {
       const outputId = `SstSiteEnv_${key}`;
       const output = new CfnOutput(this, outputId, { value });
       environmentOutputs[key] = Stack.of(this).getLogicalId(output);
@@ -131,7 +131,7 @@ class NextjsSst extends Nextjs {
       path: this.props.nextjsPath,
       stack: Stack.of(this).node.id,
       environmentOutputs,
-    } as BaseSiteEnvironmentOutputsInfo);
+    });
   }
 }
 ```

diff --git a/assets/index.html → assets/PlaceholderSite/index.html b/assets/index.html → assets/PlaceholderSite/index.html
@@ -37,6 +37,10 @@
       <h1>NextJS AWS</h1>
       <p>This is a placeholder.</p>
       <p>Probably you want to connect to your local NextJS dev server.</p>
+      <p>
+        Please feel free to peruse <a href="https://github.com/jetbridge/cdk-nextjs#readme">the documentation</a> for
+        this NextJS construct.
+      </p>
     </section>
   </body>
 </html>
diff --git a/src/Nextjs.ts b/src/Nextjs.ts
@@ -363,8 +363,8 @@ export class Nextjs extends Construct {
     // handle placeholder
     if (this.props.isPlaceholder) {
       return new cloudfront.Distribution(this, 'Distribution', {
-        defaultRootObject: 'placeholder/index.html',
-        errorResponses: buildErrorResponsesForRedirectToIndex('placeholder/index.html'),
+        defaultRootObject: 'index.html',
+        errorResponses: buildErrorResponsesForRedirectToIndex('index.html'),
         domainNames,
         certificate: this.certificate,
         defaultBehavior: {
@@ -545,7 +545,7 @@ export class Nextjs extends Construct {
         }),
         viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
       },
-      ...this.props.cdk?.distribution,
+      ...this.props.cdk?.distribution, // not sure if needed
     });
   }
 

diff --git a/src/NextjsAssetsDeployment.ts b/src/NextjsAssetsDeployment.ts
@@ -65,7 +65,7 @@ export class NextJsAssetsDeployment extends Construct {
     this.deployments = this.uploadS3Assets(this.staticTempDir);
 
     // do rewrites of unresolved CDK tokens in static files
-    if (this.props.environment) {
+    if (this.props.environment && !this.props.isPlaceholder) {
       const rewriter = new NextjsS3EnvRewriter(this, 'NextjsS3EnvRewriter', {
         ...props,
         s3Bucket: this.bucket,
@@ -93,7 +93,7 @@ export class NextJsAssetsDeployment extends Construct {
     // path to public folder; root static assets
     const staticDir = this.props.nextBuild.nextStaticDir;
     let publicDir = this.props.isPlaceholder
-      ? path.resolve(__dirname, '../assets/placeholder-site')
+      ? path.resolve(__dirname, '../assets/PlaceholderSite')
       : this.props.nextBuild.nextPublicDir;
 
     if (!this.props.isPlaceholder && fs.existsSync(staticDir)) {
@@ -132,7 +132,6 @@ export class NextJsAssetsDeployment extends Construct {
 
     const deployment = new BucketDeployment(this, 'NextStaticAssetsS3Deployment', {
       destinationBucket: this.bucket,
-      destinationKeyPrefix: this.props.isPlaceholder ? '/placeholder' : '/',
       sources: [Source.asset(archiveZipFilePath)],
       distribution: this.props.distribution,
       prune: this.props.prune,

diff --git a/src/NextjsBuild.ts b/src/NextjsBuild.ts
@@ -80,7 +80,12 @@ export class NextjsBuild extends Construct {
   }
 
   private runNpmBuild() {
-    const { nextjsPath } = this.props;
+    const { nextjsPath, isPlaceholder, quiet } = this.props;
+
+    if (isPlaceholder) {
+      if (!quiet) console.debug(`Skipping build for placeholder NextjsBuild at ${nextjsPath}`);
+      return;
+    }
 
     // validate site path exists
     if (!fs.existsSync(nextjsPath)) {
@@ -145,7 +150,7 @@ export class NextjsBuild extends Construct {
     const nextDir = this._getNextBuildDir();
     const standaloneDir = path.join(nextDir, NEXTJS_BUILD_STANDALONE_DIR);
 
-    if (!fs.existsSync(standaloneDir)) {
+    if (!fs.existsSync(standaloneDir) && !this.props.isPlaceholder) {
       throw new Error(`Could not find ${standaloneDir} directory.`);
     }
     return standaloneDir;

diff --git a/src/NextjsLambda.ts b/src/NextjsLambda.ts
@@ -46,12 +46,12 @@ const RUNTIME = lambda.Runtime.NODEJS_16_X;
  * Build a lambda function from a NextJS application to handle server-side rendering, API routes, and image optimization.
  */
 export class NextJsLambda extends Construct {
-  configBucket: Bucket;
+  configBucket?: Bucket;
   lambdaFunction: Function;
 
   constructor(scope: Construct, id: string, props: NextjsLambdaProps) {
     super(scope, id);
-    const { nextBuild, function: functionOptions } = props;
+    const { nextBuild, function: functionOptions, isPlaceholder } = props;
 
     // bundle server handler
     // delete default nextjs handler if it exists
@@ -98,7 +98,7 @@ export class NextJsLambda extends Construct {
 
     // upload the lambda package to S3
     const s3asset = new s3Assets.Asset(scope, 'MainFnAsset', { path: zipFilePath });
-    const code = props.isPlaceholder
+    const code = isPlaceholder
       ? lambda.Code.fromInline(
           "module.exports.handler = async () => { return { statusCode: 200, body: 'SST placeholder site' } }"
         )
@@ -119,28 +119,31 @@ export class NextJsLambda extends Construct {
     });
     this.lambdaFunction = fn;
 
-    // put JSON file with env var replacements in S3
-    const [configBucket, configDeployment] = this.createConfigBucket(props);
-    this.configBucket = configBucket;
-
-    // replace env var placeholders in the lambda package with resolved values
-    const rewriter = new NextjsS3EnvRewriter(this, 'LambdaCodeRewriter', {
-      ...props,
-      s3Bucket: s3asset.bucket,
-      s3keys: [s3asset.s3ObjectKey],
-      replacementConfig: {
-        // use json file in S3 for replacement values
-        // this can contain backend secrets so better to not have them in custom resource logs
-        jsonS3Bucket: configDeployment.deployedBucket,
-        jsonS3Key: CONFIG_ENV_JSON_PATH,
-      },
-      debug: true, // enable for more verbose output from the rewriter function
-    });
-    rewriter.node.addDependency(s3asset);
+    // rewrite env var placeholders in server code
+    if (!isPlaceholder) {
+      // put JSON file with env var replacements in S3
+      const [configBucket, configDeployment] = this.createConfigBucket(props);
+      this.configBucket = configBucket;
+
+      // replace env var placeholders in the lambda package with resolved values
+      const rewriter = new NextjsS3EnvRewriter(this, 'LambdaCodeRewriter', {
+        ...props,
+        s3Bucket: s3asset.bucket,
+        s3keys: [s3asset.s3ObjectKey],
+        replacementConfig: {
+          // use json file in S3 for replacement values
+          // this can contain backend secrets so better to not have them in custom resource logs
+          jsonS3Bucket: configDeployment.deployedBucket,
+          jsonS3Key: CONFIG_ENV_JSON_PATH,
+        },
+        debug: true, // enable for more verbose output from the rewriter function
+      });
+      rewriter.node.addDependency(s3asset);
 
-    // in order to create this dependency, the lambda function needs to be a child of the current construct
-    // meaning we can't inherit from Function
-    fn.node.addDependency(rewriter); // don't deploy lambda until rewriter is done - we are sort of 'intercepting' the deployment package
+      // in order to create this dependency, the lambda function needs to be a child of the current construct
+      // meaning we can't inherit from Function
+      fn.node.addDependency(rewriter); // don't deploy lambda until rewriter is done - we are sort of 'intercepting' the deployment package
+    }
   }
 
   // this can hold our resolved environment vars for the server