sst 2.0.0-rc.9 → 2.0.0

package/constructs/SsrSite.js

@@ -6,26 +6,27 @@ import crypto from "crypto";
 import spawn from "cross-spawn";
 import { execSync } from "child_process";
 import { Construct } from "constructs";
-import { Fn, Duration, CfnOutput, RemovalPolicy, CustomResource, } from "aws-cdk-lib";
-import * as s3 from "aws-cdk-lib/aws-s3";
-import * as iam from "aws-cdk-lib/aws-iam";
-import * as lambda from "aws-cdk-lib/aws-lambda";
-import * as route53 from "aws-cdk-lib/aws-route53";
-import * as s3Assets from "aws-cdk-lib/aws-s3-assets";
-import * as cloudfront from "aws-cdk-lib/aws-cloudfront";
-import * as acm from "aws-cdk-lib/aws-certificatemanager";
+import { Fn, Token, Duration as CdkDuration, CfnOutput, RemovalPolicy, CustomResource, } from "aws-cdk-lib";
+import { Bucket } from "aws-cdk-lib/aws-s3";
+import { Effect, PolicyStatement } from "aws-cdk-lib/aws-iam";
+import { Function, Code, Runtime, FunctionUrlAuthType, } from "aws-cdk-lib/aws-lambda";
+import { HostedZone, ARecord, AaaaRecord, RecordTarget, } from "aws-cdk-lib/aws-route53";
+import { Asset } from "aws-cdk-lib/aws-s3-assets";
+import { Distribution, ViewerProtocolPolicy, AllowedMethods, CachedMethods, LambdaEdgeEventType, CachePolicy, CacheQueryStringBehavior, CacheHeaderBehavior, CacheCookieBehavior, } from "aws-cdk-lib/aws-cloudfront";
 import { AwsCliLayer } from "aws-cdk-lib/lambda-layer-awscli";
-import * as origins from "aws-cdk-lib/aws-cloudfront-origins";
-import * as route53Targets from "aws-cdk-lib/aws-route53-targets";
-import * as route53Patterns from "aws-cdk-lib/aws-route53-patterns";
+import { S3Origin, HttpOrigin } from "aws-cdk-lib/aws-cloudfront-origins";
+import { CloudFrontTarget } from "aws-cdk-lib/aws-route53-targets";
 import { Stack } from "./Stack.js";
 import { Logger } from "../logger.js";
 import { isCDKConstruct } from "./Construct.js";
-import { getBuildCmdEnvironment, buildErrorResponsesForRedirectToIndex, } from "./BaseSite.js";
+import { getBuildCmdEnvironment, } from "./BaseSite.js";
+import { HttpsRedirect } from "./cdk/website-redirect.js";
+import { DnsValidatedCertificate } from "./cdk/dns-validated-certificate.js";
 import { attachPermissionsToRole } from "./util/permission.js";
 import { ENVIRONMENT_PLACEHOLDER, getParameterPath, } from "./util/functionBinding.js";
 import { SiteEnv } from "../site-env.js";
-import { useProject } from "../app.js";
+import { useProject } from "../project.js";
+import { VisibleError } from "../error.js";
 const __dirname = url.fileURLToPath(new URL(".", import.meta.url));
 /**
  * The `SsrSite` construct is a higher level CDK construct that makes it easy to create modern web apps with Server Side Rendering capabilities.
@@ -40,79 +41,66 @@ const __dirname = url.fileURLToPath(new URL(".", import.meta.url));
  */
 export class SsrSite extends Construct {
     id;
-    /**
-     * Exposes CDK instances created within the construct.
-     */
-    cdk;
     props;
-    /**
-     * Determines if a placeholder site should be deployed instead. We will set
-     * this to `true` by default when performing local development, although the
-     * user can choose to override this value.
-     */
-    isPlaceholder;
-    /**
-     * The root SST directory used for builds.
-     */
-    sstBuildDir;
+    doNotDeploy;
     buildConfig;
     serverLambdaForEdge;
     serverLambdaForRegional;
-    awsCliLayer;
+    bucket;
+    distribution;
+    hostedZone;
+    certificate;
     constructor(scope, id, props) {
-        super(scope, props.cdk?.id || id);
-        this.id = id;
+        super(scope, props?.cdk?.id || id);
         const app = scope.node.root;
-        this.isPlaceholder =
-            (app.local || app.skipBuild) && !props.disablePlaceholder;
-        this.sstBuildDir = useProject().paths.artifacts;
-        this.props = props;
-        this.cdk = {};
-        this.awsCliLayer = new AwsCliLayer(this, "AwsCliLayer");
+        this.id = id;
+        this.props = {
+            path: ".",
+            waitForInvalidation: false,
+            timeout: "10 seconds",
+            memorySize: "1024 MB",
+            ...props,
+        };
+        this.doNotDeploy = (app.local || app.skipBuild) && !this.props.dev?.deploy;
         this.validateSiteExists();
         this.registerSiteEnvironment();
-        this.buildConfig = this.initBuildConfig();
-        // Prepare app
-        if (!this.isPlaceholder) {
-            this.buildApp();
+        if (this.doNotDeploy) {
+            // @ts-ignore
+            this.buildConfig = this.bucket = this.distribution = null;
+            return;
         }
+        const cliLayer = new AwsCliLayer(this, "AwsCliLayer");
+        // Build app
+        this.buildConfig = this.initBuildConfig();
+        this.buildApp();
         // Create Bucket which will be utilised to contain the statics
-        this.cdk.bucket = this.createS3Bucket();
+        this.bucket = this.createS3Bucket();
         // Create Server functions
-        if (props.edge) {
+        if (this.props.edge) {
             this.serverLambdaForEdge = this.createFunctionForEdge();
             this.createFunctionPermissionsForEdge();
         }
         else {
             this.serverLambdaForRegional = this.createFunctionForRegional();
             this.createFunctionPermissionsForRegional();
-            this.cdk.function = this.serverLambdaForRegional;
         }
         // Create Custom Domain
         this.validateCustomDomainSettings();
-        this.cdk.hostedZone = this.lookupHostedZone();
-        this.cdk.certificate = this.createCertificate();
+        this.hostedZone = this.lookupHostedZone();
+        this.certificate = this.createCertificate();
         // Create S3 Deployment
-        const assets = this.isPlaceholder
-            ? this.createStaticsS3AssetsWithStub()
-            : this.createStaticsS3Assets();
-        const s3deployCR = this.createS3Deployment(assets);
+        const assets = this.createS3Assets();
+        const assetFileOptions = this.createS3AssetFileOptions();
+        const s3deployCR = this.createS3Deployment(cliLayer, assets, assetFileOptions);
         // Create CloudFront
         this.validateCloudFrontDistributionSettings();
-        if (props.edge) {
-            this.cdk.distribution = this.isPlaceholder
-                ? this.createCloudFrontDistributionForStub()
-                : this.createCloudFrontDistributionForEdge();
-        }
-        else {
-            this.cdk.distribution = this.isPlaceholder
-                ? this.createCloudFrontDistributionForStub()
-                : this.createCloudFrontDistributionForRegional();
-        }
-        this.cdk.distribution.node.addDependency(s3deployCR);
+        this.distribution = this.props.edge
+            ? this.createCloudFrontDistributionForEdge()
+            : this.createCloudFrontDistributionForRegional();
+        this.distribution.node.addDependency(s3deployCR);
         // Invalidate CloudFront
-        const invalidationCR = this.createCloudFrontInvalidation();
-        invalidationCR.node.addDependency(this.cdk.distribution);
+        const invalidationCR = this.createCloudFrontInvalidation(cliLayer);
+        invalidationCR.node.addDependency(this.distribution);
         // Connect Custom Domain to CloudFront Distribution
         this.createRoute53Records();
     }
@@ -123,13 +111,19 @@ export class SsrSite extends Construct {
      * The CloudFront URL of the website.
      */
     get url() {
-        return `https://${this.cdk.distribution.distributionDomainName}`;
+        if (this.doNotDeploy) {
+            return;
+        }
+        return `https://${this.distribution.distributionDomainName}`;
     }
     /**
      * If the custom domain is enabled, this is the URL of the website with the
      * custom domain.
      */
     get customDomainUrl() {
+        if (this.doNotDeploy) {
+            return;
+        }
         const { customDomain } = this.props;
         if (!customDomain) {
             return;
@@ -142,28 +136,19 @@ export class SsrSite extends Construct {
         }
     }
     /**
-     * The ARN of the internally created S3 Bucket.
-     */
-    get bucketArn() {
-        return this.cdk.bucket.bucketArn;
-    }
-    /**
-     * The name of the internally created S3 Bucket.
-     */
-    get bucketName() {
-        return this.cdk.bucket.bucketName;
-    }
-    /**
-     * The ID of the internally created CloudFront Distribution.
-     */
-    get distributionId() {
-        return this.cdk.distribution.distributionId;
-    }
-    /**
-     * The domain name of the internally created CloudFront Distribution.
+     * The internally created CDK resources.
      */
-    get distributionDomain() {
-        return this.cdk.distribution.distributionDomainName;
+    get cdk() {
+        if (this.doNotDeploy) {
+            throw new VisibleError(`Cannot access CDK resources for the "${this.node.id}" site in dev mode`);
+        }
+        return {
+            function: this.serverLambdaForRegional,
+            bucket: this.bucket,
+            distribution: this.distribution,
+            hostedZone: this.hostedZone,
+            certificate: this.certificate,
+        };
     }
     /////////////////////
     // Public Methods
@@ -188,7 +173,6 @@ export class SsrSite extends Construct {
         return {
             type: "SsrSite",
             data: {
-                distributionId: this.cdk.distribution.distributionId,
                 customDomainUrl: this.customDomainUrl,
             },
         };
@@ -204,13 +188,13 @@ export class SsrSite extends Construct {
                     // depend on the Site. B/c often the site depends on the Api, causing
                     // a CloudFormation circular dependency if the Api and the Site belong
                     // to different stacks.
-                    environment: ENVIRONMENT_PLACEHOLDER,
+                    environment: this.doNotDeploy ? "" : ENVIRONMENT_PLACEHOLDER,
                     parameter: this.customDomainUrl || this.url,
                 },
             },
             permissions: {
                 "ssm:GetParameters": [
-                    `arn:aws:ssm:${app.region}:${app.account}:parameter${getParameterPath(this, "url")}`,
+                    `arn:${Stack.of(this).partition}:ssm:${app.region}:${app.account}:parameter${getParameterPath(this, "url")}`,
                 ],
             },
         };
@@ -223,7 +207,6 @@ export class SsrSite extends Construct {
             serverBuildOutputFile: "placeholder",
             clientBuildOutputDir: "placeholder",
             clientBuildVersionedSubDir: "placeholder",
-            siteStub: "placeholder",
         };
     }
     buildApp() {
@@ -272,13 +255,13 @@ export class SsrSite extends Construct {
     /////////////////////
     // Bundle S3 Assets
     /////////////////////
-    createStaticsS3Assets() {
+    createS3Assets() {
         // Create temp folder, clean up if exists
-        const zipOutDir = path.resolve(path.join(this.sstBuildDir, `Site-${this.node.id}-${this.node.addr}`));
+        const zipOutDir = path.resolve(path.join(useProject().paths.artifacts, `Site-${this.node.id}-${this.node.addr}`));
         fs.rmSync(zipOutDir, { recursive: true, force: true });
         // Create zip files
         const app = this.node.root;
-        const script = path.resolve(__dirname, "../support/base-site-archiver.cjs");
+        const script = path.resolve(__dirname, "../support/base-site-archiver.mjs");
         const fileSizeLimit = app.isRunningSSTTest()
             ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                 // @ts-ignore: "sstTestFileSizeLimitOverride" not exposed in props
@@ -302,18 +285,40 @@ export class SsrSite extends Construct {
             if (!fs.existsSync(zipFilePath)) {
                 break;
             }
-            assets.push(new s3Assets.Asset(this, `Asset${partId}`, {
+            assets.push(new Asset(this, `Asset${partId}`, {
                 path: zipFilePath,
             }));
         }
         return assets;
     }
-    createStaticsS3AssetsWithStub() {
-        return [
-            new s3Assets.Asset(this, "Asset", {
-                path: this.buildConfig.siteStub,
-            }),
-        ];
+    createS3AssetFileOptions() {
+        // Build file options
+        const fileOptions = [];
+        const clientPath = path.join(this.props.path, this.buildConfig.clientBuildOutputDir);
+        for (const item of fs.readdirSync(clientPath)) {
+            // Versioned files will be cached for 1 year (immutable) both at
+            // CDN and browser level.
+            if (item === this.buildConfig.clientBuildVersionedSubDir) {
+                fileOptions.push({
+                    exclude: "*",
+                    include: `${this.buildConfig.clientBuildVersionedSubDir}/*`,
+                    cacheControl: "public,max-age=31536000,immutable",
+                });
+            }
+            // Un-versioned files will be cached for 1 year at the CDN level.
+            // But not at the browser level. CDN cache will be invalidated on deploy.
+            else {
+                const itemPath = path.join(clientPath, item);
+                fileOptions.push({
+                    exclude: "*",
+                    include: fs.statSync(itemPath).isDirectory()
+                        ? `${item}/*`
+                        : `${item}`,
+                    cacheControl: "public,max-age=0,s-maxage=31536000,must-revalidate",
+                });
+            }
+        }
+        return fileOptions;
     }
     createS3Bucket() {
         const { cdk } = this.props;
@@ -324,7 +329,7 @@ export class SsrSite extends Construct {
         // cdk.bucket is a prop
         else {
             const bucketProps = cdk?.bucket;
-            return new s3.Bucket(this, "S3Bucket", {
+            return new Bucket(this, "S3Bucket", {
                 publicReadAccess: true,
                 autoDeleteObjects: true,
                 removalPolicy: RemovalPolicy.DESTROY,
@@ -332,58 +337,32 @@ export class SsrSite extends Construct {
             });
         }
     }
-    createS3Deployment(assets) {
+    createS3Deployment(cliLayer, assets, fileOptions) {
         // Create a Lambda function that will be doing the uploading
-        const uploader = new lambda.Function(this, "S3Uploader", {
-            code: lambda.Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
-            layers: [this.awsCliLayer],
-            runtime: lambda.Runtime.PYTHON_3_7,
+        const uploader = new Function(this, "S3Uploader", {
+            code: Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
+            layers: [cliLayer],
+            runtime: Runtime.PYTHON_3_7,
             handler: "s3-upload.handler",
-            timeout: Duration.minutes(15),
+            timeout: CdkDuration.minutes(15),
             memorySize: 1024,
         });
-        this.cdk.bucket.grantReadWrite(uploader);
+        this.bucket.grantReadWrite(uploader);
         assets.forEach((asset) => asset.grantRead(uploader));
         // Create the custom resource function
-        const handler = new lambda.Function(this, "S3Handler", {
-            code: lambda.Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
-            layers: [this.awsCliLayer],
-            runtime: lambda.Runtime.PYTHON_3_7,
+        const handler = new Function(this, "S3Handler", {
+            code: Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
+            layers: [cliLayer],
+            runtime: Runtime.PYTHON_3_7,
             handler: "s3-handler.handler",
-            timeout: Duration.minutes(15),
+            timeout: CdkDuration.minutes(15),
             memorySize: 1024,
             environment: {
                 UPLOADER_FUNCTION_NAME: uploader.functionName,
             },
         });
-        this.cdk.bucket.grantReadWrite(handler);
+        this.bucket.grantReadWrite(handler);
         uploader.grantInvoke(handler);
-        // Build file options
-        const fileOptions = [];
-        const clientPath = path.join(this.props.path, this.buildConfig.clientBuildOutputDir);
-        for (const item of fs.readdirSync(clientPath)) {
-            // Versioned files will be cached for 1 year (immutable) both at
-            // CDN and browser level.
-            if (item === this.buildConfig.clientBuildVersionedSubDir) {
-                fileOptions.push({
-                    exclude: "*",
-                    include: `${this.buildConfig.clientBuildVersionedSubDir}/*`,
-                    cacheControl: "public,max-age=31536000,immutable",
-                });
-            }
-            // Un-versioned files will be cached for 1 year at the CDN level.
-            // But not at the browser level. CDN cache will be invalidated on deploy.
-            else {
-                const itemPath = path.join(clientPath, item);
-                fileOptions.push({
-                    exclude: "*",
-                    include: fs.statSync(itemPath).isDirectory()
-                        ? `${item}/*`
-                        : `${item}`,
-                    cacheControl: "public,max-age=0,s-maxage=31536000,must-revalidate",
-                });
-            }
-        }
         // Create custom resource
         return new CustomResource(this, "S3Deployment", {
             serviceToken: handler.functionArn,
@@ -393,7 +372,7 @@ export class SsrSite extends Construct {
                     BucketName: asset.s3BucketName,
                     ObjectKey: asset.s3ObjectKey,
                 })),
-                DestinationBucketName: this.cdk.bucket.bucketName,
+                DestinationBucketName: this.bucket.bucketName,
                 FileOptions: (fileOptions || []).map(({ exclude, include, cacheControl }) => {
                     return [
                         "--exclude",
@@ -404,6 +383,7 @@ export class SsrSite extends Construct {
                         cacheControl,
                     ];
                 }),
+                ReplaceValues: this.getS3ContentReplaceValues(),
             },
         });
     }
@@ -417,14 +397,14 @@ export class SsrSite extends Construct {
         return {};
     }
     createFunctionPermissionsForRegional() {
-        const { defaults } = this.props;
-        this.cdk.bucket.grantReadWrite(this.serverLambdaForRegional.role);
-        if (defaults?.function?.permissions) {
-            attachPermissionsToRole(this.serverLambdaForRegional.role, defaults.function.permissions);
+        const { permissions } = this.props;
+        this.bucket.grantReadWrite(this.serverLambdaForRegional.role);
+        if (permissions) {
+            attachPermissionsToRole(this.serverLambdaForRegional.role, permissions);
         }
     }
     createFunctionPermissionsForEdge() {
-        this.cdk.bucket.grantReadWrite(this.serverLambdaForEdge.role);
+        this.bucket.grantReadWrite(this.serverLambdaForEdge.role);
     }
     /////////////////////
     // CloudFront Distribution
@@ -442,15 +422,15 @@ export class SsrSite extends Construct {
     createCloudFrontDistributionForRegional() {
         const { cdk } = this.props;
         const cfDistributionProps = cdk?.distribution || {};
-        const s3Origin = new origins.S3Origin(this.cdk.bucket);
-        return new cloudfront.Distribution(this, "Distribution", {
+        const s3Origin = new S3Origin(this.bucket);
+        return new Distribution(this, "Distribution", {
             // these values can be overwritten by cfDistributionProps
             defaultRootObject: "",
             // Override props.
             ...cfDistributionProps,
             // these values can NOT be overwritten by cfDistributionProps
             domainNames: this.buildDistributionDomainNames(),
-            certificate: this.cdk.certificate,
+            certificate: this.certificate,
             defaultBehavior: this.buildDistributionDefaultBehaviorForRegional(),
             additionalBehaviors: {
                 ...this.buildDistributionStaticFileBehaviors(s3Origin),
@@ -461,15 +441,15 @@ export class SsrSite extends Construct {
     createCloudFrontDistributionForEdge() {
         const { cdk } = this.props;
         const cfDistributionProps = cdk?.distribution || {};
-        const s3Origin = new origins.S3Origin(this.cdk.bucket);
-        return new cloudfront.Distribution(this, "Distribution", {
+        const s3Origin = new S3Origin(this.bucket);
+        return new Distribution(this, "Distribution", {
             // these values can be overwritten by cfDistributionProps
             defaultRootObject: "",
             // Override props.
             ...cfDistributionProps,
             // these values can NOT be overwritten by cfDistributionProps
             domainNames: this.buildDistributionDomainNames(),
-            certificate: this.cdk.certificate,
+            certificate: this.certificate,
             defaultBehavior: this.buildDistributionDefaultBehaviorForEdge(s3Origin),
             additionalBehaviors: {
                 ...this.buildDistributionStaticFileBehaviors(s3Origin),
@@ -477,18 +457,6 @@ export class SsrSite extends Construct {
             },
         });
     }
-    createCloudFrontDistributionForStub() {
-        return new cloudfront.Distribution(this, "Distribution", {
-            defaultRootObject: "index.html",
-            errorResponses: buildErrorResponsesForRedirectToIndex("index.html"),
-            domainNames: this.buildDistributionDomainNames(),
-            certificate: this.cdk.certificate,
-            defaultBehavior: {
-                origin: new origins.S3Origin(this.cdk.bucket),
-                viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
-            },
-        });
-    }
     buildDistributionDomainNames() {
         const { customDomain } = this.props;
         const domainNames = [];
@@ -507,16 +475,15 @@ export class SsrSite extends Construct {
         const { cdk } = this.props;
         const cfDistributionProps = cdk?.distribution || {};
         const fnUrl = this.serverLambdaForRegional.addFunctionUrl({
-            authType: lambda.FunctionUrlAuthType.NONE,
+            authType: FunctionUrlAuthType.NONE,
         });
         return {
-            viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
-            origin: new origins.HttpOrigin(Fn.parseDomainName(fnUrl.url)),
-            allowedMethods: cloudfront.AllowedMethods.ALLOW_ALL,
-            cachedMethods: cloudfront.CachedMethods.CACHE_GET_HEAD_OPTIONS,
+            viewerProtocolPolicy: ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
+            origin: new HttpOrigin(Fn.parseDomainName(fnUrl.url)),
+            allowedMethods: AllowedMethods.ALLOW_ALL,
+            cachedMethods: CachedMethods.CACHE_GET_HEAD_OPTIONS,
             compress: true,
-            cachePolicy: cdk?.cachePolicies?.serverRequests ??
-                this.createCloudFrontServerCachePolicy(),
+            cachePolicy: cdk?.serverCachePolicy ?? this.createCloudFrontServerCachePolicy(),
             ...(cfDistributionProps.defaultBehavior || {}),
         };
     }
@@ -524,19 +491,18 @@ export class SsrSite extends Construct {
         const { cdk } = this.props;
         const cfDistributionProps = cdk?.distribution || {};
         return {
-            viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
+            viewerProtocolPolicy: ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
             origin,
-            allowedMethods: cloudfront.AllowedMethods.ALLOW_ALL,
-            cachedMethods: cloudfront.CachedMethods.CACHE_GET_HEAD_OPTIONS,
+            allowedMethods: AllowedMethods.ALLOW_ALL,
+            cachedMethods: CachedMethods.CACHE_GET_HEAD_OPTIONS,
             compress: true,
-            cachePolicy: cdk?.cachePolicies?.serverRequests ??
-                this.createCloudFrontServerCachePolicy(),
+            cachePolicy: cdk?.serverCachePolicy ?? this.createCloudFrontServerCachePolicy(),
             ...(cfDistributionProps.defaultBehavior || {}),
             // concatenate edgeLambdas
             edgeLambdas: [
                 {
                     includeBody: true,
-                    eventType: cloudfront.LambdaEdgeEventType.ORIGIN_REQUEST,
+                    eventType: LambdaEdgeEventType.ORIGIN_REQUEST,
                     functionVersion: this.serverLambdaForEdge.currentVersion,
                 },
                 ...(cfDistributionProps.defaultBehavior?.edgeLambdas || []),
@@ -547,12 +513,12 @@ export class SsrSite extends Construct {
         const { cdk } = this.props;
         // Create additional behaviours for statics
         const staticBehaviourOptions = {
-            viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
+            viewerProtocolPolicy: ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
             origin,
-            allowedMethods: cloudfront.AllowedMethods.ALLOW_GET_HEAD_OPTIONS,
-            cachedMethods: cloudfront.CachedMethods.CACHE_GET_HEAD_OPTIONS,
+            allowedMethods: AllowedMethods.ALLOW_GET_HEAD_OPTIONS,
+            cachedMethods: CachedMethods.CACHE_GET_HEAD_OPTIONS,
             compress: true,
-            cachePolicy: cloudfront.CachePolicy.CACHING_OPTIMIZED,
+            cachePolicy: CachePolicy.CACHING_OPTIMIZED,
         };
         // Add behaviour for public folder statics (excluding build)
         const staticsBehaviours = {};
@@ -568,51 +534,46 @@ export class SsrSite extends Construct {
         return staticsBehaviours;
     }
     createCloudFrontServerCachePolicy() {
-        return new cloudfront.CachePolicy(this, "ServerCache", {
-            queryStringBehavior: cloudfront.CacheQueryStringBehavior.all(),
-            headerBehavior: cloudfront.CacheHeaderBehavior.none(),
-            cookieBehavior: cloudfront.CacheCookieBehavior.all(),
-            defaultTtl: Duration.days(0),
-            maxTtl: Duration.days(365),
-            minTtl: Duration.days(0),
+        return new CachePolicy(this, "ServerCache", {
+            queryStringBehavior: CacheQueryStringBehavior.all(),
+            headerBehavior: CacheHeaderBehavior.none(),
+            cookieBehavior: CacheCookieBehavior.all(),
+            defaultTtl: CdkDuration.days(0),
+            maxTtl: CdkDuration.days(365),
+            minTtl: CdkDuration.days(0),
             enableAcceptEncodingBrotli: true,
             enableAcceptEncodingGzip: true,
             comment: "SST server response cache policy",
         });
     }
-    createCloudFrontInvalidation() {
+    createCloudFrontInvalidation(cliLayer) {
         // Create a Lambda function that will be doing the invalidation
-        const invalidator = new lambda.Function(this, "CloudFrontInvalidator", {
-            code: lambda.Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
-            layers: [this.awsCliLayer],
-            runtime: lambda.Runtime.PYTHON_3_7,
+        const invalidator = new Function(this, "CloudFrontInvalidator", {
+            code: Code.fromAsset(path.join(__dirname, "../support/base-site-custom-resource")),
+            layers: [cliLayer],
+            runtime: Runtime.PYTHON_3_7,
             handler: "cf-invalidate.handler",
-            timeout: Duration.minutes(15),
+            timeout: CdkDuration.minutes(15),
             memorySize: 1024,
         });
         // Grant permissions to invalidate CF Distribution
-        invalidator.addToRolePolicy(new iam.PolicyStatement({
-            effect: iam.Effect.ALLOW,
+        invalidator.addToRolePolicy(new PolicyStatement({
+            effect: Effect.ALLOW,
             actions: [
                 "cloudfront:GetInvalidation",
                 "cloudfront:CreateInvalidation",
             ],
             resources: ["*"],
         }));
-        const waitForInvalidation = this.isPlaceholder
-            ? false
-            : this.props.waitForInvalidation === false
-                ? false
-                : true;
         return new CustomResource(this, "CloudFrontInvalidation", {
             serviceToken: invalidator.functionArn,
             resourceType: "Custom::SSTCloudFrontInvalidation",
             properties: {
-                BuildId: this.isPlaceholder ? "live" : this.generateBuildId(),
-                DistributionId: this.cdk.distribution.distributionId,
+                BuildId: this.generateBuildId(),
+                DistributionId: this.distribution.distributionId,
                 // TODO: Ignore the browser build path as it may speed up invalidation
                 DistributionPaths: ["/*"],
-                WaitForInvalidation: waitForInvalidation,
+                WaitForInvalidation: this.props.waitForInvalidation,
             },
         });
     }
@@ -647,7 +608,7 @@ export class SsrSite extends Construct {
         }
         let hostedZone;
         if (typeof customDomain === "string") {
-            hostedZone = route53.HostedZone.fromLookup(this, "HostedZone", {
+            hostedZone = HostedZone.fromLookup(this, "HostedZone", {
                 domainName: customDomain,
             });
         }
@@ -655,7 +616,7 @@ export class SsrSite extends Construct {
             hostedZone = customDomain.cdk.hostedZone;
         }
         else if (typeof customDomain.hostedZone === "string") {
-            hostedZone = route53.HostedZone.fromLookup(this, "HostedZone", {
+            hostedZone = HostedZone.fromLookup(this, "HostedZone", {
                 domainName: customDomain.hostedZone,
             });
         }
@@ -664,7 +625,7 @@ export class SsrSite extends Construct {
             if (customDomain.isExternalDomain === true) {
                 return;
             }
-            hostedZone = route53.HostedZone.fromLookup(this, "HostedZone", {
+            hostedZone = HostedZone.fromLookup(this, "HostedZone", {
                 domainName: customDomain.domainName,
             });
         }
@@ -680,11 +641,11 @@ export class SsrSite extends Construct {
         }
         let acmCertificate;
         // HostedZone is set for Route 53 domains
-        if (this.cdk.hostedZone) {
+        if (this.hostedZone) {
             if (typeof customDomain === "string") {
-                acmCertificate = new acm.DnsValidatedCertificate(this, "Certificate", {
+                acmCertificate = new DnsValidatedCertificate(this, "Certificate", {
                     domainName: customDomain,
-                    hostedZone: this.cdk.hostedZone,
+                    hostedZone: this.hostedZone,
                     region: "us-east-1",
                 });
             }
@@ -692,9 +653,9 @@ export class SsrSite extends Construct {
                 acmCertificate = customDomain.cdk.certificate;
             }
             else {
-                acmCertificate = new acm.DnsValidatedCertificate(this, "Certificate", {
+                acmCertificate = new DnsValidatedCertificate(this, "Certificate", {
                     domainName: customDomain.domainName,
-                    hostedZone: this.cdk.hostedZone,
+                    hostedZone: this.hostedZone,
                     region: "us-east-1",
                 });
             }
@@ -709,7 +670,7 @@ export class SsrSite extends Construct {
     }
     createRoute53Records() {
         const { customDomain } = this.props;
-        if (!customDomain || !this.cdk.hostedZone) {
+        if (!customDomain || !this.hostedZone) {
             return;
         }
         let recordName;
@@ -724,15 +685,15 @@ export class SsrSite extends Construct {
         // Create DNS record
         const recordProps = {
             recordName,
-            zone: this.cdk.hostedZone,
-            target: route53.RecordTarget.fromAlias(new route53Targets.CloudFrontTarget(this.cdk.distribution)),
+            zone: this.hostedZone,
+            target: RecordTarget.fromAlias(new CloudFrontTarget(this.distribution)),
         };
-        new route53.ARecord(this, "AliasRecord", recordProps);
-        new route53.AaaaRecord(this, "AliasRecordAAAA", recordProps);
+        new ARecord(this, "AliasRecord", recordProps);
+        new AaaaRecord(this, "AliasRecordAAAA", recordProps);
         // Create Alias redirect record
         if (domainAlias) {
-            new route53Patterns.HttpsRedirect(this, "Redirect", {
-                zone: this.cdk.hostedZone,
+            new HttpsRedirect(this, "Redirect", {
+                zone: this.hostedZone,
                 recordNames: [domainAlias],
                 targetDomain: recordName,
             });
@@ -741,6 +702,24 @@ export class SsrSite extends Construct {
     /////////////////////
     // Helper Functions
     /////////////////////
+    getS3ContentReplaceValues() {
+        const replaceValues = [];
+        Object.entries(this.props.environment || {})
+            .filter(([, value]) => Token.isUnresolved(value))
+            .forEach(([key, value]) => {
+            const token = `{{ ${key} }}`;
+            replaceValues.push({
+                files: "**/*.html",
+                search: token,
+                replace: value,
+            }, {
+                files: "**/*.js",
+                search: token,
+                replace: value,
+            });
+        });
+        return replaceValues;
+    }
     validateSiteExists() {
         const { path: sitePath } = this.props;
         if (!fs.existsSync(sitePath)) {