What advantages does CfnAppSync provide over using AppSync in a CDK project?

We are in the process of enhancing our API by adding new JS resolvers and phasing out the VTL resolvers for an AWS AppSync CDK project, specifically built with Cfn<> Cloud Front CDK. The code snippet below illustrates how this can be achieved:

          let resolver = new CfnResolver(this, `${r.typeName}_${r.fieldName}`, {
            apiId: graphql.attrApiId,
            typeName: r.typeName,
            fieldName: r.fieldName,
            dataSourceName: r.dataSourceName,
            requestMappingTemplate: readVtl(reqPath, contextVariables),
            responseMappingTemplate: readVtl(resPath, contextVariables),
          });

All recent examples from AWS CDK Example showcase the use of AppSync CDK following this approach.

new appsync.Resolver(this, 'pipeline-resolver-create-posts', {
      api,
      typeName: 'Mutation',
      fieldName: 'createPost',
      code: appsync.Code.fromInline(`
          export function request(ctx) {
          return {};
          }

          export function response(ctx) {
          return ctx.prev.result;
          }
  `),
      runtime: appsync.FunctionRuntime.JS_1_0_0,
      pipelineConfig: [add_func_2],
    });

I am facing challenges in getting the CfnResolver to accept new JS resolvers. I have explored various options without success and referred to the AWS documentation here

          let resolver = new CfnResolver(this, `${r.typeName}_${r.fieldName}`, {
            apiId: graphql.attrApiId,
            typeName: r.typeName,
            fieldName: r.fieldName,
            dataSourceName: r.dataSourceName,
            code: readJs(reqPath, contextVariables),
            runtime: CfnResolver.AppSyncRunTime.JS_1_0_0 <-- DOESNT WORK
          });

Could someone provide guidance on what might be going wrong or whether transitioning from Cfn CDK to direct AppSync CDK is a better option? Thank you.

Answer №1

The runtime syntax is incorrect in the CfnResolver you provided. Instead, utilize the FunctionRuntime utility class to simultaneously set the runtime name (APPSYNC_JS) and version (1.0.0):

runtime: FunctionRuntime.JS_1_0_0,

As mentioned by @gshpychka in the comments, it's generally recommended to use the L2 Resolver construct. The Resolver constructor automates the creation of a L1 CfnResolver resource while offering improved Developer Experience (DX). For instance, you can separate your resolver code into a distinct file and reference it using Code.fromAsset('path/to/code.js'), which enhances support for linting, testing, and Typescript.

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

"Creating a sleek and efficient AI chess game using chess.js with Angular's

Cannot read property 'moves' of undefine Hello there! I am currently working on developing a chess game using Angular. I'm facing an issue with the artificial intelligence in the game where the piece seems to get stuck in the mouse. The l ...

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 ...

Use bracket notation to verify if a property is undefined

Having some difficulty determining if the property value of an object is undefined when accessed dynamically with bracket notation. Here's a snippet of my code: function toBritishDate(date: Date | string): string { console.log(date) return &qu ...

What steps can I take to ensure that the elements are in the same row instead of being displayed in three separate rows?

(I'm a beginner in web development and need some help) Is there a way to align elements into the same row instead of stacking them up in separate rows? I'm working on creating a header bar similar to the one on the Naive UI Documentation Website. ...

Improving PHP-FPM Settings for WordPress on Bitnami EC2 t3a.medium Server

Running a WordPress website on an AWS EC2 t3a.medium (4Gb Ram) instance using Bitnami can be challenging. Often, the server's RAM gets completely filled, leading to crashes that require manual intervention to restart it via the EC2 console. To addres ...

Tips for tuning a MatTable in angular without using a filterPredicate

I'm facing a challenge with my MatTable component where I need to filter the data using previously stored values from user input. While I can verify that the values match the data, I'm unsure of how to apply filtering without relying on the filte ...

What is the command line method for running ESLint in flat configuration?

When using the flat config for eslint.config.js, how can I lint *.js files recursively from the command line? 1 In the past with eslintrc.js or eslintrc.json, I have used npx eslint . --ext .js, as mentioned here. Up until now, it has always worked withou ...

Exploring the integration of NodeJS with a SQL database

When it comes to running tests that involve integrating a NodeJS API with a database, what would be the most effective setup? Along with conducting unit tests, I want to be able to populate the database with dummy data and test different behaviors using t ...

Creating circular artwork with PixiJS: A step-by-step guide

I am trying to create a circular image with specific height and width dimensions, but have not found a satisfactory solution. Currently, I can achieve this using a texture, however it is drawn multiple times in the same position. const test = new Graphic ...

What is the best way to retrieve an object from a loop only once the data is fully prepared?

Hey, I'm just stepping into the world of async functions and I could use some help. My goal is to return an object called name_dates, but unfortunately when I check the console it's empty. Can you take a look at my code? Here's what I have ...

challenges with template inheritance: when one template takes precedence over another

I have encountered an issue with my two HTML templates, login.html and signup.html. Both of these files inherit from the base.html file, but there seems to be a problem where one file is overriding the title and content of the other. So when I visit /login ...

Parsing JSON results in the return of two objects

I am analyzing a JSON file, expecting it to return Message[] using a promise. This code is similar to the one utilized in the Heroes sample project found in HTTP documentation { "data": [ {"id":"1","commid":"0","subject":"test1subject","body":" ...

Is there a way to access the value of a public variable within the @input decorator of a function type?

I am working on a dropdown component that utilizes the @Input decorator to define a function with arguments, returning a boolean value. dropdown-abstract.component.ts @Input() public itemDisabled: (itemArgs: { dataItem: any; index: number }) => boo ...

Error message TS2339: The method 'findAll' is not defined in the current context

Despite following the Sequelize guide for TypeScript configuration, I am unable to resolve an issue with my database connection. The connection is active, but I am struggling with a specific type problem: TSError: ⨯ Unable to compile TypeScript: controll ...

I'm confused by the function: "sort((a: Article, b: Article) => b.votes - a.votes);"

I'm having trouble grasping the concept of the return statement in sortedArticles(). Can anyone provide me with a resource or explain how this sorting function works? sortedArticles(): Article[] { return this.articles.sort((a: Article, b: Article ...

Find out if a dynamically imported component has finished loading in Nextjs

Here is a simplified version of my current situation import React, { useState } from 'react'; import dynamic from 'next/dynamic'; const DynamicImportedComponent = dynamic(() => import('Foo/baz'), { ssr: false, loading ...

Is there a way to retrieve terraform variables within python scripts?

Within my primary main.tf configuration file, the following module is defined: module "aws_lambda" { ... envs = { bucket_name = "bucket_name" prefix = "prefix" } } In Module main.tf: resource "aws_la ...

Creating a dynamic dropdown menu where the available options in one select box change based on the selection made in another

Looking at the Material-UI Stepper code, I have a requirement to create a select element with dynamic options based on the selected value in another select within the same React component. To achieve this, I wrote a switch function: function getGradeConte ...

Discovering the generic type from an optional parameter within a constructor

Looking to implement an optional parameter within a constructor, where the type is automatically determined based on the property's type. However, when no argument is provided, TypeScript defaults to the type "unknown" rather than inferring it as "und ...

A step-by-step guide on accessing the data from an uploaded JSON file in a React application

One exciting feature is the drag and drop component that allows users to add multiple files. However, there seems to be an issue with displaying the content of a JSON file once it's added. Below is the code snippet in question: if (files?.length) ...