Skip to content

Conversation

@osawa-koki
Copy link

Issue #, if available:

When following the instructions at https://docs.amplify.aws/nextjs/start/quickstart/nextjs-app-router-client-components/, the following error occurs:

Attempted import error: 'useForm' is not exported from 'react-hook-form' (imported as 'useForm').

The cause is that the component, which is intended to be added in the tutorial, needs to be a client-side component, while the current layout.tsx is defined as a server-side component.
In the tutorial code, the "use client"; directive is specified, but the code of this repo is not.

Description of changes:

  • put "use client"; at the top of layout.tsx.
  • remove metadata exports.
    • metadata exports is not needed when it's client-side component.

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

osawa-koki added a commit to osawa-koki/amplify-gen2-with-cypress that referenced this pull request Oct 27, 2024
osawa-koki added a commit to osawa-koki/amplify-gen2-with-cypress that referenced this pull request Oct 27, 2024
@Raghavendarlokineni
Copy link

Thanks @osawa-koki you saved my day. Was struggling with this issue for a long time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants