The parameter of type "Construct" cannot be assigned the argument of type "undefined"

Question

The parameter of type "Construct" cannot be assigned the argument of type "undefined"

I attempted to use code example from the AWS CDK documentation, but it did not function as I had anticipated.

Using CDK version 2.62.2 with Typescript. In various parts of the code, a declaration error occurs stating that

The argument of type "undefined" cannot be assigned to the parameter of type "Construct"

.

Code:

import * as ec2 from 'aws-cdk-lib/aws-ec2';
import * as ecs from 'aws-cdk-lib/aws-ecs';
import * as cdk from 'aws-cdk-lib';
import { Construct } from 'constructs';

declare const vpc: ec2.Vpc;

// Creating an ECS cluster
const cluster = new ecs.Cluster(this, 'Cluster', { vpc });

// Adding capacity to the cluster
cluster.addCapacity('DefaultAutoScalingGroupCapacity', {
  instanceType: new ec2.InstanceType("t2.xlarge"),
  desiredCapacity: 3,
});

const taskDefinition = new ecs.Ec2TaskDefinition(this, 'TaskDef');

taskDefinition.addContainer('DefaultContainer', {
  image: ecs.ContainerImage.fromRegistry("amazon/amazon-ecs-sample"),
  memoryLimitMiB: 512,
});

// Initializing an Amazon ECS Service
const ecsService = new ecs.Ec2Service(this, 'Service', {
  cluster,
  taskDefinition,
});

typescript amazon-web-services amazon-ec2 amazon-ecs aws-cdk

Answer 1

Answer №1

TL;DR The issue arises from the fact that the this keyword is undefined in your code. To resolve this, you should move your instantiation code to a construct subclass constructor.

When defining a construct in CDK, the first argument is its scope, or parent construct. While using the this keyword as the scope is correct, it is currently undefined in your code. The recommended CDK approach is to define constructs inside the constructor of a construct subclass, typically a Stack. Within the Stack's constructor, the reference to this will point to the Stack instance.

Additionally, in your code, the variable vpc is also undefined. It's worth noting that the CDK documentation often uses TypeScript variable declaration statements for brevity. Although this may not be causing an error, it might not yield the expected behavior. To avoid default Vpc creation (if vpc prop is undefined), make sure to instantiate a Vpc rather than simply declaring the vpc variable.

class MyStack extends Stack {
  constructor(scope: App, id: string, props?: StackProps) {
    super(scope, id, props);

    const vpc = new ec2.Vpc(this, 'Vpc', { maxAzs: 2 });

    const cluster = new ecs.Cluster(this, 'Cluster', { vpc });
  }
}

For complete working ECS examples for EC2, you can explore the aws-samples/aws-cdk-examples repository.

Answer 2

TL;DR The issue arises from the fact that the this keyword is undefined in your code. To resolve this, you should move your instantiation code to a construct subclass constructor.

When defining a construct in CDK, the first argument is its scope, or parent construct. While using the this keyword as the scope is correct, it is currently undefined in your code. The recommended CDK approach is to define constructs inside the constructor of a construct subclass, typically a Stack. Within the Stack's constructor, the reference to this will point to the Stack instance.

Additionally, in your code, the variable vpc is also undefined. It's worth noting that the CDK documentation often uses TypeScript variable declaration statements for brevity. Although this may not be causing an error, it might not yield the expected behavior. To avoid default Vpc creation (if vpc prop is undefined), make sure to instantiate a Vpc rather than simply declaring the vpc variable.

class MyStack extends Stack {
  constructor(scope: App, id: string, props?: StackProps) {
    super(scope, id, props);

    const vpc = new ec2.Vpc(this, 'Vpc', { maxAzs: 2 });

    const cluster = new ecs.Cluster(this, 'Cluster', { vpc });
  }
}

For complete working ECS examples for EC2, you can explore the aws-samples/aws-cdk-examples repository.

Answer 3

Answer №2

When creating a new ecs.Cluster, it's important to ensure that you define a valid VPC instead of passing along an "Undefined" value. Simply declaring the constant without assigning a value can lead to errors.

To properly create a new VPC, consider updating the line from:

declare const vpc: ec2.Vpc;

To something like:

const vpc = new ec2.Vpc(this, 'TheVPC')

For more information on this topic, refer to the documentation available at https://docs.aws.amazon.com/cdk/api/v2/docs/aws-cdk-lib.aws_ec2.Vpc.html.

Answer 4

When creating a new ecs.Cluster, it's important to ensure that you define a valid VPC instead of passing along an "Undefined" value. Simply declaring the constant without assigning a value can lead to errors.

To properly create a new VPC, consider updating the line from:

declare const vpc: ec2.Vpc;

To something like:

const vpc = new ec2.Vpc(this, 'TheVPC')

For more information on this topic, refer to the documentation available at https://docs.aws.amazon.com/cdk/api/v2/docs/aws-cdk-lib.aws_ec2.Vpc.html.

The parameter of type "Construct" cannot be assigned the argument of type "undefined"

Answer №1

Answer №2

Similar questions

experiencing an excessive amount of rerenders when trying to utilize the

Building a TypeScript Rest API with efficient routing, controllers, and classes for seamless management

Unable to locate module within Typescript

Discover the magic of observing prop changes in Vue Composition API / Vue 3!

The object may be null even after being enclosed in an if statement

What could be causing an error with NextJS's getStaticPaths when running next build?

Setting up grunt-ts to function seamlessly with LiveReload

Combining Different Types of Errors

Infer the types and flatten arrays within arrays

Unable to import necessary modules within my React TypeScript project

Extending the Object prototype within an ES6 module can lead to errors such as "Property not found on type 'Object'."

Issue with Angular 2 Observable not triggering the complete function

Syncing data between local storage and a remote server using Ionic5 provider

Combine values from 2 distinct arrays nested within an array of objects and present them as a unified array

Storing API URLs in a configuration file for a React application hosted on AWS S3: Best Practices

Exploring the integration of an Angular 4 application with Visual Studio 2017 using dot net core. Techniques for accessing configuration keys from appsetting.json in a TypeScript

<Click here to navigate to page 2> await whenClicked={navigation.navigate("page_2")} />

Assigning a dynamic name to an object in Typescript is a powerful feature

Using memoization for React Typescript callback passed as a prop

The 'type' property is not present in the 'ChartComponent' type, however, it is necessary in the 'ApexChart' type