next.js icon indicating copy to clipboard operation
next.js copied to clipboard

@next/codemod: next-image-to-legacy-image doesn't run

Open timothyis opened this issue 3 years ago • 1 comments

Verify canary release

  • [X] I verified that the issue exists in the latest Next.js canary release

Provide environment information

I don't believe my Next.js environment is important to this issue.

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

Describe the Bug

When trying to update my project to Next.js 13, I got this error message in the console:

Image with src "/_next/static/media/kap-app-preview.1f510d76.png" has legacy prop "layout". Did you forget to run the codemod?
Read more: https://nextjs.org/docs/messages/next-image-upgrade-to-13

Clicking on that "Read more" link goes to a page that recommends running npx @next/codemod next-image-to-legacy-image . before moving to the new image component. However, running that command fails with the following error:

➜ npx @next/codemod next-image-to-legacy-image .
Need to install the following packages:
  @next/codemod
Ok to proceed? (y)
Invalid transform choice, pick one of:
- name-default-component
- add-missing-react-import
- withamp-to-config
- url-to-withrouter
- cra-to-next
- new-link

I assume this isn't my fault since I'm not sure how I could break the information that I copy and pasted from the documentation.

Expected Behavior

Codemod runs and updates occurrences of next/image.

Link to reproduction

I ran this in github.com/wulkano/getkap.co, but I don't think a repro is relevant to the issue.

To Reproduce

Run npx @next/codemod next-image-to-legacy-image . in a Next.js repository that's freshly upgrade to Next.js 13.

timothyis avatar Nov 02 '22 14:11 timothyis

Just to note @next/codemod@canary works with this command, so the documentation should note this is required.

I would have submitted this as a documentation update issue but I wasn't aware it was an issue with documentation listing the wrong thing rather than the module error when I submitted.

Also, it would be very helpful if the issue templates in this repository were more descriptive, like if there was an issue template for @next/codemod bugs, etc. Seems like it would make issues a lot easier to manage for you all.

timothyis avatar Nov 02 '22 14:11 timothyis

Can confirm, I'm getting the same issue with next-image-to-legacy-image, new-link, and built-in-next-font.

I've tried both @next/codemod and @next/codemod@latest

Screenshot 2023-03-21 at 1 32 31 PM

More context: This appears to work in a standalone next.js app, but when I try this in a turborepo monorepo, within the apps folder, the codemod just plainly does not work.

tgaeta avatar Mar 21 '23 18:03 tgaeta

Closing as the docs have been updated to reflect the command should be npx @next/codemod@latest instead.

ijjk avatar Mar 22 '23 00:03 ijjk

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

github-actions[bot] avatar Apr 21 '23 12:04 github-actions[bot]