eslint-plugin-valtio weekly downloads statistics

eslint-plugin-valtio

Valtio linting plugin for better development.

Installation

for yarn users:

Usage

eslint v9 / flat config

eslint v8 and below

Add valtio to the extends section of your .eslintrc configuration file.

Rules

Alternatively, you can enable rules in the plugin, selectively.

Why

This plugin helps you catch common mistakes that can occur in valtio. Here are some cases that this plugin catches.

Rules Breakdown

Snapshots in callbacks are not recommended

We shouldn't use snapshots in callbacks, because snapshots can be stale there.

Proxies in render phase is not recommended

In render phase, it's better to use snapshots (as they're made to be compatible with react's reactivity) instead of states directly.

Snapshots mutating is not possible

Snapshots are made to be used in the react render phase, and not mutable. So, we need to mutate proxy states directly.

Computed declaration order

In the way valtio treats objects in proxyWithComputed, the order of fields matters; for example, quadrupled comes before doubled, but it depends on doubled, so the order is wrong! So we need to bring doubled first.

Using this in proxy (valtio/avoid-this-in-proxy)

When working with proxy using this in it's context as long as taken care of will work as expected but since the implementation differs from a simple proxy to a snapshot version of the proxy, using this could get confusing. This rule is specifically for beginners that are adapting to the structure/differences in valtio.

Description from the npm listing.