support extending client config (`amplifyconfiguration.json`)

rpostulart commented 9 months ago

Before opening, please confirm:

[X] I have searched for duplicate or closed issues and discussions.
[X] I have read the guide for submitting bug reports.
[X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

Next.js

Amplify APIs

Not applicable

Amplify Categories

Not applicable

Environment information

``` System: OS: macOS 14.1.2 CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz Memory: 15.65 MB / 16.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 20.8.0 - /usr/local/bin/node Yarn: 1.22.5 - /usr/local/bin/yarn npm: 10.1.0 - /usr/local/bin/npm Watchman: 2022.12.26.00 - /usr/local/bin/watchman Browsers: Chrome: 120.0.6099.129 Edge: 120.0.2210.91 Safari: 17.1.2 npmPackages: @ampproject/toolbox-optimizer: undefined () @aws-amplify/adapter-nextjs: ^1.0.7 => 1.0.7 @aws-amplify/adapter-nextjs/api: undefined () @aws-amplify/adapter-nextjs/data: undefined () @aws-amplify/backend: ^0.6.0 => 0.6.0 @aws-amplify/backend-cli: ^0.9.2 => 0.9.2 @aws-amplify/ui-react: ^6.0.6 => 6.0.6 @aws-amplify/ui-react-internal: undefined () @babel/core: undefined () @babel/runtime: 7.22.5 @edge-runtime/cookies: 4.0.2 @edge-runtime/ponyfill: 2.4.1 @edge-runtime/primitives: 4.0.2 @hapi/accept: undefined () @headlessui/react: ^1.7.17 => 1.7.17 @heroicons/react: ^2.0.18 => 2.0.18 @mswjs/interceptors: undefined () @napi-rs/triples: undefined () @next/font: undefined () @next/react-dev-overlay: undefined () @opentelemetry/api: undefined () @segment/ajv-human-errors: undefined () @types/node: ^20 => 20.10.4 @types/react: ^18 => 18.2.45 @types/react-dom: ^18 => 18.2.17 @vercel/nft: undefined () @vercel/og: 0.5.15 acorn: undefined () amphtml-validator: undefined () anser: undefined () arg: undefined () assert: undefined () async-retry: undefined () async-sema: undefined () autoprefixer: ^10.0.1 => 10.4.16 aws-amplify: ^6.0.7 => 6.0.7 aws-amplify/adapter-core: undefined () aws-amplify/analytics: undefined () aws-amplify/analytics/kinesis: undefined () aws-amplify/analytics/kinesis-firehose: undefined () aws-amplify/analytics/personalize: undefined () aws-amplify/analytics/pinpoint: undefined () aws-amplify/api: undefined () aws-amplify/api/server: undefined () aws-amplify/auth: undefined () aws-amplify/auth/cognito: undefined () aws-amplify/auth/cognito/server: undefined () aws-amplify/auth/server: undefined () aws-amplify/datastore: undefined () aws-amplify/in-app-messaging: undefined () aws-amplify/in-app-messaging/pinpoint: undefined () aws-amplify/push-notifications: undefined () aws-amplify/push-notifications/pinpoint: undefined () aws-amplify/storage: undefined () aws-amplify/storage/s3: undefined () aws-amplify/storage/s3/server: undefined () aws-amplify/storage/server: undefined () aws-amplify/utils: undefined () aws-cdk-lib: ^2.115.0 => 2.115.0 babel-packages: undefined () browserify-zlib: undefined () browserslist: undefined () buffer: undefined () bytes: undefined () ci-info: undefined () cli-select: undefined () client-only: 0.0.1 clsx: ^2.0.0 => 2.0.0 comment-json: undefined () compression: undefined () conf: undefined () constants-browserify: undefined () constructs: ^10.3.0 => 10.3.0 content-disposition: undefined () content-type: undefined () cookie: undefined () cross-spawn: undefined () crypto-browserify: undefined () css.escape: undefined () data-uri-to-buffer: undefined () debug: undefined () devalue: undefined () domain-browser: undefined () edge-runtime: undefined () eslint: ^8 => 8.55.0 eslint-config-next: 14.0.4 => 14.0.4 events: undefined () find-cache-dir: undefined () find-up: undefined () framer-motion: ^10.16.16 => 10.16.16 fresh: undefined () get-orientation: undefined () glob: undefined () gzip-size: undefined () http-proxy: undefined () http-proxy-agent: undefined () https-browserify: undefined () https-proxy-agent: undefined () icss-utils: undefined () ignore-loader: undefined () image-size: undefined () is-animated: undefined () is-docker: undefined () is-wsl: undefined () jest-worker: undefined () json5: undefined () jsonwebtoken: undefined () loader-runner: undefined () loader-utils: undefined () lodash.curry: undefined () lru-cache: undefined () micromatch: undefined () mini-css-extract-plugin: undefined () nanoid: undefined () native-url: undefined () neo-async: undefined () next: 14.0.4 => 14.0.4 node-fetch: undefined () node-html-parser: undefined () ora: undefined () os-browserify: undefined () p-limit: undefined () path-browserify: undefined () platform: undefined () postcss: ^8 => 8.4.32 (8.4.31) postcss-flexbugs-fixes: undefined () postcss-modules-extract-imports: undefined () postcss-modules-local-by-default: undefined () postcss-modules-scope: undefined () postcss-modules-values: undefined () postcss-preset-env: undefined () postcss-safe-parser: undefined () postcss-scss: undefined () postcss-value-parser: undefined () process: undefined () punycode: undefined () querystring-es3: undefined () raw-body: undefined () react: ^18 => 18.2.0 react-builtin: undefined () react-dom: ^18 => 18.2.0 react-dom-builtin: undefined () react-dom-experimental-builtin: undefined () react-experimental-builtin: undefined () react-is: 18.2.0 react-refresh: 0.12.0 react-server-dom-turbopack-builtin: undefined () react-server-dom-turbopack-experimental-builtin: undefined () react-server-dom-webpack-builtin: undefined () react-server-dom-webpack-experimental-builtin: undefined () regenerator-runtime: 0.13.4 sass-loader: undefined () scheduler-builtin: undefined () scheduler-experimental-builtin: undefined () schema-utils: undefined () semver: undefined () send: undefined () server-only: 0.0.1 setimmediate: undefined () shell-quote: undefined () source-map: undefined () stacktrace-parser: undefined () stream-browserify: undefined () stream-http: undefined () string-hash: undefined () string_decoder: undefined () strip-ansi: undefined () superstruct: undefined () tailwindcss: ^3.3.0 => 3.3.6 tar: undefined () terser: undefined () text-table: undefined () timers-browserify: undefined () tty-browserify: undefined () typescript: ^5.3.3 => 5.3.3 (4.4.4) ua-parser-js: undefined () unistore: undefined () util: undefined () vm-browserify: undefined () watchpack: undefined () web-vitals: undefined () webpack: undefined () webpack-sources: undefined () ws: undefined () zod: undefined () npmGlobalPackages: @aws-amplify/cli: 12.3.0 @expo/ngrok: 4.1.1 ajv-cli: 5.0.0 amplify-cli: 1.0.0 appium: 1.22.3 aws-cdk: 2.115.0 create-expo-app: 1.1.4 eas-cli: 3.12.1 expo-cli: 6.3.7 javascript: 1.0.0 npm: 10.1.0 yarn: 1.22.5 ```

Describe the bug

When adding a CDK custom resource stack (https://docs.amplify.aws/gen2/build-a-backend/add-aws-services/custom-resources/), for example like API gateway. There is no cdk-export.json created which can be used together with amplifyconfiguration.json in Amplify.congifure().

And amplifyconfiguration.json also does not contain the CDK created resources.


import { defineBackend } from "@aws-amplify/backend";
import { auth } from "./auth/resource.js";
import { data } from "./data/resource.js";
import { CdkGatewayStack } from "./custom/apigateway/resource.js";

const backend = defineBackend({
  auth,
  data,
});

new CdkGatewayStack(
  backend.createStack("CustomAPIGateway"),
  "CustomNotifications"
);

Expected behavior

I expect a file which can be used in your Amplify project

Reproduction steps

Run npx amplify sandbox

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

cwomack commented 9 months ago

Hello, @rpostulart 👋 and thanks for opening this issue. With Gen 2 still being in "developer preview", the support for REST API's or custom outputs to the Amplify config is not yet available.

We'd also want to make sure this feature request gets captured on the amplify-backend, as I didn't see one related to this yet. I'll transfer this issue there to get better assistance and ensure it's seen!

rpostulart commented 9 months ago

thanks @cwomack . Ok great, I will wait for that feature. As I create a file cdk-exports.json manually and add the resources like:

{
  "CdkGatewayStack": {
    "ACGatewayEndpointD9037AB1": "https://1sdfsdsdfg8.execute-api.eu-central-1.amazonaws.com/prod/"
  }
}

When I combine this with amplifyconfiguration.json then it's working.

So I expect the feature is there only when npx run sandbox is hit, it should create or update the cdk-export.json file

edwardfoyle commented 4 months ago

We now have the backend.addOutput mechanism to add additional outputs to the client config file https://docs.amplify.aws/gen2/build-a-backend/add-aws-services/rest-api/

aws-amplify / amplify-backend