Experiencing an error message stating 'The token ${Token[TOKEN.72]} is invalid' while using cdk synth, specifically when trying to assign the value of ec2.Vpc.cidr from cfnParameter.value

Attempting to utilize the AWS CDK CfnParameter to parameterize the CIDR value of ec2.Vpc. The aim is to make the stack reusable for VPC creation with the CIDR as a customizable value.

An error stating "${Token[TOKEN.72]} is not valid" occurs during synthesis ($cdk synth) of the stack for the following code snippet:


        // Parameter
        const vpcCidr = new cdk.CfnParameter(this, 'vpcCidr', {
            type: 'String',
            default: "10.0.0.0/16",
            minLength: 10,
            maxLength: 18,
            allowedPattern: '(\\d{1,3})\.(\\d{1,3})\.(\\d{1,3})\.(\\d{1,3})/(\\d{1,2})'
        });

        // VPC Configuration
        const vpc = new ec2.Vpc(this, "vpcName", {
            cidr: vpcCidr.valueAsString,
            maxAzs: 2,
            vpnGateway: true,
            subnetConfiguration: [
                {
                    cidrMask: 19,
                    name: "Private",
                    subnetType: SubnetType.PRIVATE,
                },
                {
                    cidrMask: 20,
                    name: "Public",
                    subnetType: SubnetType.PUBLIC,
                },
                {
                    cidrMask: 21,
                    name: "Protected",
                    subnetType: SubnetType.ISOLATED,
                },
            ],
        });

When passing a static string for the CIDR block, it works fine:


        // VPC Configuration
        const vpc = new ec2.Vpc(this, "vpcName", {
            cidr: "10.0.0.0/16",
            maxAzs: 2,
            vpnGateway: true,
            subnetConfiguration: [
                {
                    cidrMask: 19,
                    name: "Private",
                    subnetType: SubnetType.PRIVATE,
                },
                {
                    cidrMask: 20,
                    name: "Public",
                    subnetType: SubnetType.PUBLIC,
                },
                {
                    cidrMask: 21,
                    name: "Protected",
                    subnetType: SubnetType.ISOLATED,
                },
            ],
        });

Expected behavior: Setting vpcCidr.valueAsString for the CIDR property of ec2.Vpc should work the same as when setting cidr as a direct string value.

Actual error message: ${Token[TOKEN.72]} is not valid. The issue seems to be related to the function in network-util.js:


    /**
     * Converts a string IPv4 to a number
     *
     * Takes an IP Address (e.g. 174.66.173.168) and converts it to a number (e.g., 2923605416); currently only supports IPv4
     *
     * Uses the formula:
     * (first octet * 256³) + (second octet * 256²) + (third octet * 256) +
     * (fourth octet)
     *
     * @param  {string} the IP address (e.g. 174.66.173.168)
     * @returns {number} the integer value of the IP address (e.g., 2923605416)
     */
    static ipToNum(ipAddress) {
        if (!this.validIp(ipAddress)) {
            throw new Error(`${ipAddress} is not valid`);
        }
        return ipAddress
            .split('.')
            .reduce((p, c, i) => p + parseInt(c, 10) * 256 ** (3 - i), 0);
    }

Environment details:

  • AWS CDK CLI Version: 1.3.0

  "dependencies": {
    "@aws-cdk/assert": "^1.2.0",
    "@aws-cdk/aws-ec2": "^1.2.0",
    "@aws-cdk/aws-ram": "^1.2.0",
    "@aws-cdk/core": "^1.2.0"
}
  • Operating System: OSX Mojave
  • Programming Language: Typescript

Answer №1

Regrettably, it appears that the ipToNum function requires parsing and mathematical operations on the CIDR to convert it into a numeric value, making it necessary for the value to be static (known at compile time). Apologies for any inconvenience.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the reason for the truth value of `type a = {} extends {a?:number}? true:false;`?

Why is type a = {} extends {a?:number}? true:false; evaluated as true, while type b = {a?:number} extends {}? true:false; is also true! It seems like the empty object {} acts as a supertype that can extend other types. This raises some questions about ...

Is there a way to set an antd checkbox as checked even when its value is falsy within an antd formItem?

I'm currently looking to "invert" the behavior of the antd checkbox component. I am seeking to have the checkbox unchecked when the value/initialValue of the antD formItem is false. Below is my existing code: <FormItem label="Include skills list ...

Encountering the error message 'array expected for services config' within my GitLab CI/CD pipeline

My goal is to set up a pipeline in GitLab for running WebdriverIO TypeScript and Cucumber framework tests. I am encountering an issue when trying to execute wdio.conf.ts in the pipeline, resulting in this error: GitLab pipeline error Below is a snippet of ...

Unable to install vue-property-decorator

When attempting to set up Vue and TypeScript with class style using vue-property-decorator, I encountered a strange script after creating the project. I was anticipating a script like this: <script lang="ts"> import {Component, Vue} from & ...

How do @material-ui/core and @types/material-ui interact with each other?

Exploring a sample project that utilizes material-ui. Upon inspecting the package.json file, I noticed the inclusion of the following packages: { ... "dependencies": { "@material-ui/core": "^1.4.1", ... }, "devDependencies": { "@types ...

Show the textbox automatically when the checkbox is selected, otherwise keep the textbox hidden

Is it possible to display a textbox in javascript when a checkbox is already checked onLoad? And then hide the textbox if the checkbox is not checked onLoad? ...

How can you utilize both defineProps with TypeScript and set default values in Vue 3 setup? (Typescript)

Is there a way to use TypeScript types and default values in the "defineProps" function? I'm having difficulty getting it to work. Code snippet: const props = defineProps<{ type?: string color?: 'color-primary' | 'color-danger&a ...

Learn the technique for dynamically modifying Angular components within the main root component during runtime

I am looking to incorporate a dynamic form where the configuration button triggers the switch from app-login-form to login-config-form. app.component.html <div class="container p-5"> <app-login-header></app-login-header> <div cla ...

Tips for maintaining license comments in TypeScript 2.5

When creating JavaScript libraries using TypeScript v2.5 and tsc, it is important to include license comments in the built files. However, the removeComments configuration in the tsconfig.json file can remove certain comments, including license comments. ...

Are npm @types packages causing issues in Visual Studio?

Nowadays, TypeScript's type packages are typically found in node packages with the format @types/packagename. Strangely, Visual Studio, despite its support for npm packages, appears to be unable to locate them: https://i.sstatic.net/7tOK1.png The s ...

SonarQube flagging a suggestion to "eliminate this unnecessary assignment to a local variable"

Why am I encountering an error with SonarQube? How can I resolve it since the rule page does not offer a specific solution? The suggestion is to eliminate the unnecessary assignment to the local variable "validateAddressRequest". validateAddress() { ...

Automatically fill in 'Edit' within an open Dialog using Angular Material

Can you pre-populate and edit a form in Angular Material's openDialog? The form is reactive. The main component has the user's URL with their ID. When the button is clicked, the openDialog should pop up with a populated form based on the passed I ...

Encountered an error trying to access properties that are undefined while working with Ionic Angular, specifically having trouble reading the 'update

As someone who is new to building ionic angular applications (coming from a PHP background), I am currently facing an issue. I have a page with the following code: export class LicencesTabPage implements OnInit { public licencesData: any[] | void; co ...

Webpack 4 combines the power of Vue with the versatility of Typescript classes and JavaScript code simultaneously

Currently, I am in the process of migrating JS files to Typescript with the objective of being able to utilize both JS and Typescript classes within Vue. While I understand that I can convert Vue scripts into Typescript, I prefer not to do so at this momen ...

Troubleshooting fastify library errors related to ajv validation

Every time I try to build my TypeScript code, I encounter these errors: The following errors are showing up in my TypeScript code: 1. node_modules/@fastify/ajv-compiler/types/index.d.ts(1,10): error TS2305: Module 'ajv' has no exported member ...

What prevents TypeScript from allowing an async function to return a combination of type T or Promise<T>?

During the development of my API in typescript, I encountered a situation where some controller actions can be synchronous while others cannot. To address this issue, I decided to specify a response type as follows: type ActionResult =IHttpActionResult | ...

Setting a value in Ionic 3 HTML template

Attempting to assign a value in an Ionic 3 template from the ts file while also adding css properties but encountered an issue. PROBLEM Error: Uncaught (in promise): Error: No value accessor for form control with name: 'image' Error: No va ...

Typescript Error: Issue encountered while passing props. Unable to access properties as they are undefined

I encountered an issue where I created an object of a certain type and attempted to pass it to a component. However, when passing the props, I received an error message stating that it cannot read properties of undefined ('stepOne'). The error sp ...

Errors in Visual Studio regarding typescript are often not found by tsc and eslint, causing frustration for developers

Today, after restarting my computer and launching visual studio code, I encountered an unfamiliar error that I've never seen before: I haven't made any changes to my project's code (confirmed by running git status). It's unclear whethe ...

Exploring the JSON Array in Angular5 with the power of ngFor

Currently, I am working on a project using Angular5 and encountering an issue with the *ngFor directive. The model class I have defined looks like this: export class FetchApi { value: Array<String>; api_status: string; api_version: string; d ...