Feedback thread for CRA migration tool #25858
Replies: 27 comments 34 replies
-
|
Doesn't seem to work for me, missing dependency: |
Beta Was this translation helpful? Give feedback.
-
|
Running the |
Beta Was this translation helpful? Give feedback.
-
|
After the migration is successful, run next dev, |
Beta Was this translation helpful? Give feedback.
-
|
This is because I wrote the static img and used the style attribute in index.html in CRA. The style attribute has no conversion, which is not a big problem |
Beta Was this translation helpful? Give feedback.
-
|
After conversion, the CSS imports in _app.js are based on my file system and are not relative!! While in my CRA project I used relative paths.
|
Beta Was this translation helpful? Give feedback.
-
|
Even better on Windows the slashes got stripped completely But I'm used to Windows development being fragile -- the whole |
Beta Was this translation helpful? Give feedback.
-
|
If CRA users are taking advantage of SVGR, this codemod will need to deal with that. |
Beta Was this translation helpful? Give feedback.
-
|
I got this |
Beta Was this translation helpful? Give feedback.
-
|
Are you on a compatible |
Beta Was this translation helpful? Give feedback.
-
|
Didn't try yet, but can it work with react-router installed ? |
Beta Was this translation helpful? Give feedback.
-
|
Yes, you can continue using |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
When we migrate a reactJs codebase to nextJs using npx @next/codemod cra-to-next and view the page source of the page corresponding HTML page is not generated. It just shows:- <style data-next-hide-fouc="true">body{display:none}</style><style>body{display:block}</style>You need to enable JavaScript to run this app.<title>TEST App</title><script defer="" nomodule="" src="/_next/static/chunks/polyfills.js?ts=1623927770471"></script><script src="/_next/static/chunks/webpack.js?ts=1623927770471" defer=""></script><script src="/_next/static/chunks/main.js?ts=1623927770471" defer=""></script><script src="/_next/static/chunks/pages/_app.js?ts=1623927770471" defer=""></script><script src="/_next/static/chunks/pages/%5B%5B...slug%5D%5D.js?ts=1623927770471" defer=""></script><script src="/_next/static/development/_buildManifest.js?ts=1623927770471" defer=""></script><script src="/_next/static/development/_ssgManifest.js?ts=1623927770471" defer=""></script><script src="/_next/static/chunks/react-refresh.js?ts=1623927770471"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/[[...slug]]","query":{},"buildId":"development","nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script>So how can it be used for SEO? Whereas if i create a new page in /pages directory and add the similar code and then view the page source the corresponding HTML is generated. |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
This is from |
Beta Was this translation helpful? Give feedback.
-
|
react-router routes are also not being created in /pages directory with route name. so react-router is not automatically being converted and with npx @next/codemod cra-to-next only [[...slug]].js is created. so how is it migrating react-app to nextJs? |
Beta Was this translation helpful? Give feedback.
-
|
@shivika24 If you want to migrate away from React Router see this: https://nextjs.org/docs/migrating/from-react-router |
Beta Was this translation helpful? Give feedback.
-
|
I do not know what to think, got this result: and the diff shows: That's all :) |
Beta Was this translation helpful? Give feedback.
-
|
@serrg did the |
Beta Was this translation helpful? Give feedback.
-
|
@dusty |
Beta Was this translation helpful? Give feedback.
-
|
Ya, I'll put one together, thanks for the reply. |
Beta Was this translation helpful? Give feedback.
-
|
It was user error, I made the assumption that |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
@ijjk Exactly, I am trying to make a minimal example, the app is not small as you can see there is about 1762 files, I will try to cut it. |
Beta Was this translation helpful? Give feedback.
-
|
Thanks for your patience I have got your help today |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
Couple of issues I ran into. 1. When converting script imports from CRA's
|
Beta Was this translation helpful? Give feedback.
-
4.Something doesn't seem to be getting hooked up right, when I log // import NextIndexWrapper from '../src'
// next/dynamic is used to prevent breaking incompatibilities
// with SSR from window.SOME_VAR usage, if this is not used
// next/dynamic can be removed to take advantage of SSR/prerendering
import dynamic from "next/dynamic";
// try changing "ssr" to true below to test for incompatibilities, if
// no errors occur the above static import can be used instead and the
// below removed
const NextIndexWrapper = dynamic(() => import("../src"), { ssr: false });
export default function Page(props) {
console.log(props);
return <NextIndexWrapper {...props} />;
}
|
Beta Was this translation helpful? Give feedback.
-
|
The |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
gotcha, so should I remove the custom render and module.hot replacement and just have this? export default function NextIndexWrapper() {
return (
<React.StrictMode>
<BrowserRouter>
<MuiThemeProvider theme={theme}>
<CssBaseline />
<Component />
</MuiThemeProvider>
</BrowserRouter>
</React.StrictMode>
);
} |
Beta Was this translation helpful? Give feedback.
-
|
Yeah that should be the only thing needed in the |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
EDIT Nevermind I got it working, it was an environment variable issue. Do you have any resources on converting the client side routes to server side?
|
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
When running I have noticed the package.json file hasn't changed at all and hasn't included the next.js dependency. I got a lot of errors when the styled component files were commented out so I undid that and the app loads in the browser with a successful compile however only loads a white screen. Don't suppose there is something I'm missing? |
Beta Was this translation helpful? Give feedback.
-
|
Hi, can you share the project this occurred on? The commented out CSS files should have been added to |
Beta Was this translation helpful? Give feedback.
-
|
Happy to screenshare with you, I wondered if it is looking out for .css files to make global but the problem is that our files are name.css.js but imported as name.css so it might think they are global when they aren't? |
Beta Was this translation helpful? Give feedback.
-
|
Ah interesting yeah these shouldn't be moved since they are actually JS files, sounds like we will need to compare against the filesystem name instead of just the import name |
Beta Was this translation helpful? Give feedback.
-
|
Yeah that'll do it. Any idea why the package.json file didn't update? |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
Can you share your |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
When trying to run the code mod for a CRA project containing the following structure, I've ran into 2 issues, using the
|
Beta Was this translation helpful? Give feedback.
-
|
Hi, can you share the project this is occurring on or the contents of your package.json? |
Beta Was this translation helpful? Give feedback.
-
Here you have it: |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
First everything seemed fine with the migration but after clicking around a bit in the application I ran into this error that I couldn't get away after it: I thought this had to do something with the direct svg imports and tried to inline them but that didn't help. Output of the codemod script$ npx @next/codemod cra-to-next Need to install the following packages: @next/codemod Ok to proceed? (y) y npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated npm WARN deprecated cross-spawn-async@2.2.5: cross-spawn no longer requires a build toolchain, use it instead ? On which files or directory should the codemods be applied? . Transforming CRA project at: /home/mau/Dev/play/ultimate-ttt Processing 130 files... SKIP /home/mau/Dev/play/ultimate-ttt/.storybook/decorators.js SKIP /home/mau/Dev/play/ultimate-ttt/public/mockServiceWorker.js SKIP /home/mau/Dev/play/ultimate-ttt/src/App.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/App.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/index.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/setupTests.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/test-utils.tsx SKIP /home/mau/Dev/play/ultimate-ttt/cypress/integration/howToPlay.spec.ts SKIP /home/mau/Dev/play/ultimate-ttt/cypress/plugins/index.js SKIP /home/mau/Dev/play/ultimate-ttt/cypress/support/commands.js SKIP /home/mau/Dev/play/ultimate-ttt/cypress/support/index.js SKIP /home/mau/Dev/play/ultimate-ttt/cypress/support/component.js SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/ApiUrl.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/Keys.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/PlayerToTile.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/SimpleTicTacToeGame.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/Point.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/index.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/TicTacToeGame.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/routes/index.ts SKIP /home/mau/Dev/play/ultimate-ttt/lighthouserc.js SKIP /home/mau/Dev/play/ultimate-ttt/src/state/AppState.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/serviceWorker.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/configureStore.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/ArrowButtons/ArrowButtons.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/ArrowButtons/ArrowButtons.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/ArrowButtons/ArrowButtons.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Icons/IconProvider.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/react-app-env.d.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Navigation/Navigation.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Navigation/Navigation.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Paging/Paging.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Paging/Paging.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Paging/Paging.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Symbols/DrawSymbol.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/routes/routes.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Symbols/OSymbol.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Symbols/XSymbol.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/__test__/TicTacToeGame.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/__test__/Point.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/api/handlers.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/api/browser.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/lib/__test__/PlayerToTile.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/boardWithThreeMovesMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/boardWithTwoMovesMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/api/server.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/emptyBoardMock.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/finishedGameDataMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/finishedBoardMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/boardWithOneMoveMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/index.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/commonAction.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/mocks/board/unfinishedBoardMock.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/analysisGame/analysisGameReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/analysisGame/analysisGameReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/analysisGame/analysisGameSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/analysisGame/analysisGameSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/.storybook/main.js SKIP /home/mau/Dev/play/ultimate-ttt/src/state/finishedGames/finishedGameReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Icons/index.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Symbols/Symbol.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/howToPlayActions.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/finishedGames/saveFinishedGameDataSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/finishedGames/saveFinishedGameDataActions.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/finishedGames/finishedGameReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/howToPlayReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/finishedGames/saveFinishedGameDataSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/selectors/analysisGameStateSelectors.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/howToPlaySteps.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/possibleWinStates.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/selectors/appStateSelectors.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/selectors/finishedGameStateSelectors.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/selectors/howToPlayStateSelectors.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/selectors/howToPlayStateSelectors.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/AnalysisGameDisplay.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/AnalysisGame.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/ScrollElementConstants.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisOverview/AnalysisOverview.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisOverview/AnalysisOverview.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/Game/Game.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/Game/Game.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/HowToPlay/DialogActionBar.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/HowToPlay/HowToPlay.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/HowToPlay/HowToPlayContent.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/HowToPlay/HowToPlayIndicatorHint.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/HowToPlay/HowToPlayDialog.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/BigBoard/BigBoard.cy.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/BigBoard/BigBoard.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/BigBoard/BigBoard.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/BigBoard/BigBoard.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/SmallBoard/SmallBoard.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/SmallBoard/SmallBoard.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/SmallBoard/SmallBoard.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/Tile/Tile.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/Tile/Tile.cy.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/Tile/Tile.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/activeBoards/activeBoardCalculationSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/components/Board/Tile/Tile.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/activeBoards/activeBoardsActions.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/activeBoards/activeBoardsCalculationSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/howToPlaySaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/board/boardActions.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/board/boardReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/board/boardCalculationSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/activeBoards/activeBoardsReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/game/checkGameFinishedSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/game/checkGameFinishedSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/game/gameAction.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/activeBoards/activeBoardsReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/board/boardCalculationSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/board/boardReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/game/gameReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/moves/moveAction.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/moves/moveReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/game/gameReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/moves/moveValidationSaga.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/moves/moveValidationSaga.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/MoveList/MoveList.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/MoveList/MoveList.test.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/MoveList/MoveList.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisGame/NoGameFound/NoGameFound.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisOverview/GameSummaryCard/GameSummaryCard.story.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/AnalysisOverview/GameSummaryCard/GameSummaryCard.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/Game/GameFinishedDisplay/GameFinishedDisplay.cy.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/views/Game/GameFinishedDisplay/GameFinishedDisplay.tsx SKIP /home/mau/Dev/play/ultimate-ttt/src/state/howToPlay/howToPlayReducer.test.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/currentGame/moves/moveReducer.ts SKIP /home/mau/Dev/play/ultimate-ttt/src/state/analysisGame/analysisGameActions.ts OKK /home/mau/Dev/play/ultimate-ttt/.storybook/preview.js OKK /home/mau/Dev/play/ultimate-ttt/src/styles.tsx All done. Results: 0 errors 0 unmodified 128 skipped 2 ok Time elapsed: 2.554secondsadded 81 packages, removed 187 packages, changed 190 packages, and audited 4733 packages in 46s 265 packages are looking for funding 58 vulnerabilities (1 low, 28 moderate, 29 high) To address issues that do not require attention, run: To address all issues possible (including breaking changes), run: Some issues need review, and may require choosing Run |
Beta Was this translation helpful? Give feedback.
-
|
Uncaught TypeError: props.history.listen is not a function. after i migrated react-app to nextjs. |
Beta Was this translation helpful? Give feedback.
-
|
I am getting this error. npm ERR! code ERESOLVE npm ERR! A complete log of this run can be found in: |
Beta Was this translation helpful? Give feedback.
-
|
I'm experiencing a very similar issue. Not the exact dependency issues but having trouble resolving the dependency tree. |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
Hi! In my VSCode the codemod to migrate from CRA removed Do anyone else got the same problem? |
Beta Was this translation helpful? Give feedback.
-
|
I only recently found out about this migration tool (after learning React and Next from a Vue/Nuxt background). Started with a create-react-app and just followed the manual installation of Next, and it worked nicely. Just a data point. |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
Hi, after migrating and opening localhost:3000 I get this error. I googled the problem and it led me to this issue #21703 But I am not aware of any custom webpack config. |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
After running this codemod, I ran I don't do any webpack setup myself; it looks like this error is coming from the |
Beta Was this translation helpful? Give feedback.
-
|
Having the same problem here, the error seems to be caused when |
Beta Was this translation helpful? Give feedback.
-
|
For some reason all the files in my directory are skipped when running cra-to-next command. are there prerequisites prior to running the migration. command? Thanks! |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
Beta Was this translation helpful? Give feedback.
-
|
Hey! 👋 We are in the process of migrating an application from CRA to Next. After solving many issues, we were able to start the application. But at the moment it only works if we have the |
Beta Was this translation helpful? Give feedback.
-
|
Hey! I think I might be one of the first on this thread but I just migrated a React Project ~3 years old, after resolving some dependency issues (literally changing the versions) I was able to convert to Next with just the command and it works amazingly, I could see some issues arriving but I can't see any I couldn't fix within twenty minutes by looking at the Next.js docs. On another note - the performance is way up, some lagging issues I was facing are seemingly just wiped out upon the conversion and all the Next.js features I typically would use, I haven't had any issues with - this experience is far better than taking a create-next-app project and migrating it by hand which is awesome, big props to the Next.js team on this one! |
Beta Was this translation helpful? Give feedback.
-
|
Hello, |
Beta Was this translation helpful? Give feedback.
-
|
Migrating to nextjs 13.4.2, I get interop issue: |
Beta Was this translation helpful? Give feedback.
-
|
Im getting this same error as well. |
Beta Was this translation helpful? Give feedback.
-
|
Same here - any progress? |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
I did an experiment with a fresh CRA app. After the codemod was applied the app didn't want to start with the same error: After a few experiments I found this: The codemod adds this into experimental: {
craCompat: true,
},If you set the But the project won't start again. The issue is the index.tsx: Original file: const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);Should be replaced with: export default () => {
return (
<React.StrictMode>
<App />
</React.StrictMode>
);
};Adding Setting |
Beta Was this translation helpful? Give feedback.
-
|
Have the same problem, tried to follow the instructions of the last answer in a larger project but keep having issues with imported images. |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
|
When I run the migration command from |
Beta Was this translation helpful? Give feedback.
{{title}}
{{editor}}'s edit
{{editor}}'s edit
-
Please leave your feedback about the Create React App to Next.js migration tool in this thread.
Beta Was this translation helpful? Give feedback.
All reactions