Skip to content

Commit 3e56da8

Browse files
committed
docs: add package entry points section
1 parent 0bb7886 commit 3e56da8

File tree

1 file changed

+34
-12
lines changed

1 file changed

+34
-12
lines changed

README.md

+34-12
Original file line numberDiff line numberDiff line change
@@ -101,22 +101,44 @@ computePosition(referenceElement, floatingElement, {
101101

102102
[Visit the docs for detailed information](https://floating-ui.com/docs/computePosition).
103103

104-
## Development and production builds
104+
## Package entry points
105105

106-
Floating UI is published with default, development, and production builds, using
107-
Node's support for
108-
[export conditions](https://nodejs.org/api/packages.html#packages_conditional_exports).
106+
> Using webpack, Vite, or Parcel? Skip this section as modern bundlers handle
107+
> this for you.
109108
110-
- `"default"`: uses `process.env.NODE_ENV`, in which your bundler handles the
111-
env variable, dead code elimination, and minification
112-
- `"production"`: minified with no debug logging
113-
- `"development"`: unminified with debug logging
109+
Floating UI uses `process.env.NODE_ENV` to determine whether your build is in
110+
development or production mode. This allows us to add console warnings and
111+
errors during development to help you but ensure they get stripped out in
112+
production to keep the bundle size small.
114113

115-
If you're using a bundler like webpack, Vite, or Parcel, this is handled for you
116-
**automatically**.
114+
This causes an error in Rollup and low/no-build setups. To solve this, Floating
115+
UI exports browser-ready ES modules. Leverage the "browser" package export
116+
condition to use these modules.
117117

118-
If this is not handled, you must opt into one of the builds in tools that
119-
support export conditions. This is done differently for each tool.
118+
<details>
119+
<summary>Rollup example</summary>
120+
121+
The `browser` option in the `nodeResolve()` plugin will select browser versions
122+
of packages if available.
123+
124+
```js
125+
import {nodeResolve} from '@rollup/plugin-node-resolve';
126+
127+
export default {
128+
// ...
129+
plugins: [
130+
nodeResolve({
131+
browser: true,
132+
133+
// Add this line for development config, omit for
134+
// production config
135+
exportConditions: ['development'],
136+
}),
137+
],
138+
};
139+
```
140+
141+
</details>
120142

121143
## Contributing
122144

0 commit comments

Comments
 (0)