Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: Restore logger docs changes after release #6608

Merged
merged 1 commit into from
Oct 18, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,6 @@ sidebar_position: 1

# Accurate Call Stacks

import UnreleasedInfo from '../_shared/_unreleased_info.mdx';

<UnreleasedInfo />

When debugging Reanimated code, you may encounter error or warning call stacks that don't clearly indicate the root cause of the problem. These stacks can be misleading, as they often highlight code from Reanimated's internals rather than the misuse of the Reanimated API that is the source of the problem.

To address this, Reanimated provides a Metro configuration wrapper called `wrapWithReanimatedMetroConfig`. This wrapper automatically adjusts your Metro config to improve the accuracy of call stacks in warnings and errors generated by the Reanimated library.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,6 @@ sidebar_position: 2

# Logger configuration

import UnreleasedInfo from '../_shared/_unreleased_info.mdx';

<UnreleasedInfo />

Reanimated shows warnings that indicate misuses of the library API, such as modifying the [shared value](/docs/fundamentals/glossary#shared-value) during component re-render. These logs can be configured to be more or less verbose.

The **default** logger configuration doesn't require any user setup and displays **all warnings and errors**. If you want to change this behavior, use the `configureReanimatedLogger` function.
Expand Down
28 changes: 27 additions & 1 deletion packages/docs-reanimated/docs/fundamentals/getting-started.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,33 @@ To learn more about the plugin head onto to [Reanimated babel plugin](/docs/fund

</details>

### Step 3: Clear Metro bundler cache (recommended)
### Step 3: Wrap metro config with reanimated wrapper (recommended)

Wrap your existing Metro configuration in the `metro.config.js` file with the `wrapWithReanimatedMetroConfig` function.

```js
// metro.config.js
const {
wrapWithReanimatedMetroConfig,
} = require('react-native-reanimated/metro-config');

const config = {
// Your existing Metro configuration options
};

module.exports = wrapWithReanimatedMetroConfig(config);
```

<details>
<summary>Why should I do this?</summary>

Wrapping your Metro configuration with the Reanimated Metro config wrapper will result in displaying improved reanimated errors and warnings with more accurate call stacks. Thanks to this, identifying misuses of the Reanimated API will be much easier than before.

To learn more about this feature, head onto to [Accurate Call Stacks](/docs/debugging/accurate-call-stacks).

</details>

### Step 4: Clear Metro bundler cache (recommended)

<Tabs groupId="package-managers">
<TabItem value="expo" label="EXPO" default>
Expand Down
5 changes: 1 addition & 4 deletions packages/docs-reanimated/src/theme/DocSidebar/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,7 @@ export default function DocSidebarWrapper(props) {

const newItems = ['animations/withClamp'];
const experimentalItems = ['shared-element-transitions/overview'];
const unreleasedItems = [
'debugging/accurate-call-stacks',
'debugging/logger-configuration',
];
const unreleasedItems = [];

return (
<DocSidebar
Expand Down
Loading