Trying to associate APiGateway and WAF | cdk deploy error: AWS WAF couldn't perform the operation because the resource doesn't exist.

Code snapshot for the question:

    // API Gateway with Lambda integration
    const devStageName = "dev";
    const prodStageName = "prod";
    const api = new apigateway.LambdaRestApi(this, "StarterAppApi", {
      handler: postLambdaFunction, // default in case no other HTTP methods are specified via addMethod()
      description: "API Gateway for Lambda",
      proxy: false, // Ensuring the API Gateway is not a proxy
      endpointTypes: [apigateway.EndpointType.REGIONAL],
    });
    const deployment = new apigateway.Deployment(this, "Deployment", {
      api: api,
    });
    new apigateway.Stage(this, "Stage", {
      deployment: deployment,
      stageName: devStageName,
    });


// Setup WAF for CloudFront
    const cloudFrontWebAcl = new wafv2.CfnWebACL(
      this,
      "StarterAppCloudFrontWebAcl",
      {
        name: "StarterAppCloudFrontWebAcl",
        defaultAction: {
          allow: {},
        },
        scope: "CLOUDFRONT", // Use CLOUDFRONT for CloudFront distributions
        visibilityConfig: {
          cloudWatchMetricsEnabled: true,
          sampledRequestsEnabled: true,
          metricName: "webAclMetric",
        },
        rules: [
          {
            name: "AWSManagedRulesCommonRuleSet",
            priority: 1,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesCommonRuleSet", // AWS managed rule group name
                vendorName: "AWS", // Vendor name should be AWS
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesCommonRuleSet",
              sampledRequestsEnabled: true,
            },
          },
          {
            name: "AWSManagedRulesAdminProtectionRuleSet",
            priority: 2,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesAdminProtectionRuleSet",
                vendorName: "AWS",
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesAdminProtectionRuleSet",
              sampledRequestsEnabled: true,
            },
          },
          {
            name: "AWSManagedRulesKnownBadInputsRuleSet",
            priority: 3,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesKnownBadInputsRuleSet",
                vendorName: "AWS",
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesKnownBadInputsRuleSet",
              sampledRequestsEnabled: true,
            },
          },
        ],
      },
    );

    // Create a CloudFront distribution with the S3 bucket as the origin, use the OAI and associate the CloudFront WAF
    const distribution = new cloudfront.Distribution(
      this,
      "StarterAppCloudFrontDistribution",
      {
        defaultBehavior: {
          origin: new cloudfrontorigins.S3Origin(frontendBucket, {
            originAccessIdentity: oai, // Use the OAI for this origin
          }),
          viewerProtocolPolicy:
            cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
        },
        defaultRootObject: "index.html",
        certificate: certificate,
        domainNames: [`${subDomain}.${domainName}`],
        webAclId: cloudFrontWebAcl.attrArn,
      },
    );

    // Setup WAF for API Gateway
    const apiGatewayWebAcl = new wafv2.CfnWebACL(
      this,
      "StarterAppApiGatewayWebAcl",
      {
        name: "StarterAppApiGatewayWebAcl",
        defaultAction: {
          allow: {},
        },
        scope: "REGIONAL",
        visibilityConfig: {
          cloudWatchMetricsEnabled: true,
          sampledRequestsEnabled: true,
          metricName: "starterAppApiGatewayWebAclMetric",
        },
        rules: [
          {
            name: "AWSManagedRulesCommonRuleSet",
            priority: 1,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesCommonRuleSet", // AWS managed rule group name
                vendorName: "AWS", // Vendor name should be AWS
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesCommonRuleSet",
              sampledRequestsEnabled: true,
            },
          },
          {
            name: "AWSManagedRulesAdminProtectionRuleSet",
            priority: 2,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesAdminProtectionRuleSet",
                vendorName: "AWS",
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesAdminProtectionRuleSet",
              sampledRequestsEnabled: true,
            },
          },
          {
            name: "AWSManagedRulesKnownBadInputsRuleSet",
            priority: 3,
            overrideAction: { none: {} }, // No override action
            statement: {
              managedRuleGroupStatement: {
                name: "AWSManagedRulesKnownBadInputsRuleSet",
                vendorName: "AWS",
              },
            },
            visibilityConfig: {
              cloudWatchMetricsEnabled: true,
              metricName: "AWSManagedRulesKnownBadInputsRuleSet",
              sampledRequestsEnabled: true,
            },
          },
        ],
      },
    );

    // Associate above WAF with API Gateway PROD stage
    new wafv2.CfnWebACLAssociation(
      this,
      "StarterAppApiGatewayWebAclAssociation",
      {
        webAclArn: apiGatewayWebAcl.attrArn,
        resourceArn: `arn:aws:apigateway:${this.region}::/restapis/${api.restApiId}/stages/${prodStageName}`,
      },
    );