Skip to content
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
9 changes: 9 additions & 0 deletions content/en/guide/v10/debugging.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,15 @@ render(<App />, document.getElementById('root'));

Make sure to set the `NODE_ENV` variable to the correct value in your build tool.

## Debugging Signals

If you're using Preact Signals in your application, there are specialized debugging tools available:

- **[Signals Debug](https://github.com/preactjs/signals/blob/main/packages/debug)** - A development tool that provides detailed console output about signal updates, effect executions, and computed value recalculations.
- **[Signals DevTools](https://github.com/preactjs/signals/blob/main/packages/devtools-ui)** - Visual DevTools UI for debugging and visualizing Preact Signals in real-time. You can embed it directly in your page for demos, or integrate it into custom tooling.

> **Note:** These are framework-agnostic tools from the Signals library. While they work great with Preact, they're not Preact-specific.

## Debug Warnings and Errors

Sometimes you may get warnings or errors when Preact detects invalid code. These should be fixed to ensure that your app works flawlessly.
Expand Down
9 changes: 9 additions & 0 deletions content/en/guide/v10/signals.md
Original file line number Diff line number Diff line change
Expand Up @@ -693,3 +693,12 @@ function Component() {
);
}
```
## Debugging
If you're using Preact Signals in your application, there are specialized debugging tools available:
- **[Signals Debug](https://github.com/preactjs/signals/blob/main/packages/debug)** - A development tool that provides detailed console output about signal updates, effect executions, and computed value recalculations.
- **[Signals DevTools](https://github.com/preactjs/signals/blob/main/packages/devtools-ui)** - Visual DevTools UI for debugging and visualizing Preact Signals in real-time. You can embed it directly in your page for demos, or integrate it into custom tooling.
> **Note:** These are framework-agnostic tools from the Signals library. While they work great with Preact, they're not Preact-specific.
9 changes: 9 additions & 0 deletions content/en/guide/v11/debugging.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,15 @@ render(<App />, document.getElementById('root'));

Make sure to set the `NODE_ENV` variable to the correct value in your build tool.

## Debugging Signals

If you're using Preact Signals in your application, there are specialized debugging tools available:

- **[Signals Debug](https://github.com/preactjs/signals/blob/main/packages/debug)** - A development tool that provides detailed console output about signal updates, effect executions, and computed value recalculations.
- **[Signals DevTools](https://github.com/preactjs/signals/blob/main/packages/devtools-ui)** - Visual DevTools UI for debugging and visualizing Preact Signals in real-time. You can embed it directly in your page for demos, or integrate it into custom tooling.

> **Note:** These are framework-agnostic tools from the Signals library. While they work great with Preact, they're not Preact-specific.

## Debug Warnings and Errors

Sometimes you may get warnings or errors when Preact detects invalid code. These should be fixed to ensure that your app works flawlessly.
Expand Down
11 changes: 10 additions & 1 deletion content/en/guide/v11/signals.md
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@ function removeTodo(todo) {

## Building the UI

Now that we've modeled our application's state, it's time to wire in up to a nice UI that users can interact with.
Now that we've modeled our application's state, it's time to wire it up to a nice UI that users can interact with.

```jsx
function TodoList() {
Expand Down Expand Up @@ -693,3 +693,12 @@ function Component() {
);
}
```
## Debugging
If you're using Preact Signals in your application, there are specialized debugging tools available:
- **[Signals Debug](https://github.com/preactjs/signals/blob/main/packages/debug)** - A development tool that provides detailed console output about signal updates, effect executions, and computed value recalculations.
- **[Signals DevTools](https://github.com/preactjs/signals/blob/main/packages/devtools-ui)** - Visual DevTools UI for debugging and visualizing Preact Signals in real-time. You can embed it directly in your page for demos, or integrate it into custom tooling.
> **Note:** These are framework-agnostic tools from the Signals library. While they work great with Preact, they're not Preact-specific.