errors/fast-refresh-reload.mdx

---
title: Fast Refresh had to perform full reload
---

## Why This Error Occurred

Fast Refresh had to perform a full reload when you edited a file. It may be because:

- The file you're editing might have other exports in addition to a React component.
- Your React component is an anonymous function.
- The component name is in camelCase and not PascalCase, for example `textField` instead of `TextField`.

## Possible Ways to Fix It

- Move your other exports to a separate file.
- Use a named function for your React component.
- Rename your component name to pascal case.

## Useful Links

- [Fast Refresh documentation](/docs/architecture/fast-refresh)
docs: Migrate error messages to MDX and App Router. (#52038) This PR is part of a larger effort to migrate error messages to MDX and use App Router: https://github.com/vercel/front/pull/23459 2023-07-05 14:11:16 +01:00			`---`
			`title: Fast Refresh had to perform full reload`
			`---`
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
docs: Migrate error messages to MDX and App Router. (#52038) This PR is part of a larger effort to migrate error messages to MDX and use App Router: https://github.com/vercel/front/pull/23459 2023-07-05 14:11:16 +01:00			`## Why This Error Occurred`
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
			`Fast Refresh had to perform a full reload when you edited a file. It may be because:`

			`- The file you're editing might have other exports in addition to a React component.`
			`- Your React component is an anonymous function.`
Update fast-refresh-reload.md (#49953) Full refresh happens when component's name is camelCase instead of PascalCase 2023-06-14 04:45:27 +03:00			- The component name is in camelCase and not PascalCase, for example `textField` instead of `TextField`.
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
docs: Migrate error messages to MDX and App Router. (#52038) This PR is part of a larger effort to migrate error messages to MDX and use App Router: https://github.com/vercel/front/pull/23459 2023-07-05 14:11:16 +01:00			`## Possible Ways to Fix It`
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
			`- Move your other exports to a separate file.`
			`- Use a named function for your React component.`
Update fast-refresh-reload.md (#49953) Full refresh happens when component's name is camelCase instead of PascalCase 2023-06-14 04:45:27 +03:00			`- Rename your component name to pascal case.`
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
docs: Migrate error messages to MDX and App Router. (#52038) This PR is part of a larger effort to migrate error messages to MDX and use App Router: https://github.com/vercel/front/pull/23459 2023-07-05 14:11:16 +01:00			`## Useful Links`
Remove stack trace from full reload warning (#43453) Adds a new error link with possible ways to fix the cause of the full reload. Removes the stack trace and adds the file causing the error to the message. Before ![image](https://user-images.githubusercontent.com/25056922/204278894-dd773e6d-9d79-459a-abc4-243c1b22b206.png) After: ![image](https://user-images.githubusercontent.com/25056922/204278538-5e26a174-bae4-457f-aac4-f239398227f8.png) Fixes #43448 ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm build && pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) 2022-11-28 14:18:26 +01:00
docs: add and unify notes to error pages (#72838) ## Description Unify the note format according to the [contribution guide](https://nextjs.org/docs/community/contribution-guide#notes). In addition, add missing bullet points to useful links. ### Improving Documentation - [x] Run `pnpm prettier-fix` to fix formatting issues before opening the PR. - [x] Read the Docs Contribution Guide to ensure your contribution follows the docs guidelines: https://nextjs.org/docs/community/contribution-guide --------- Co-authored-by: Delba de Oliveira <32464864+delbaoliveira@users.noreply.github.com> 2024-11-19 18:44:42 +09:00			`- [Fast Refresh documentation](/docs/architecture/fast-refresh)`