https://github.com/rspack-contrib/rsbuild-plugin-devtools-json
Rsbuild plugin for generating `com.chrome.devtools.json` on the fly in the dev server.
https://github.com/rspack-contrib/rsbuild-plugin-devtools-json
rsbuild rsbuild-plugin
Last synced: 5 months ago
JSON representation
Rsbuild plugin for generating `com.chrome.devtools.json` on the fly in the dev server.
- Host: GitHub
- URL: https://github.com/rspack-contrib/rsbuild-plugin-devtools-json
- Owner: rspack-contrib
- License: mit
- Created: 2025-06-20T13:05:44.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2025-06-22T12:31:41.000Z (5 months ago)
- Last Synced: 2025-06-22T12:34:51.454Z (5 months ago)
- Topics: rsbuild, rsbuild-plugin
- Language: TypeScript
- Homepage:
- Size: 10.7 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-rstack - rsbuild-plugin-devtools-json
README
# rsbuild-plugin-devtools-json
Rsbuild plugin for generating the Chrome DevTools project settings file on-the-fly in the dev server.
This enables seamless integration with the new Chrome DevTools features:
1. [DevTools Project Settings (devtools.json)](https://goo.gle/devtools-json-design)
2. [Automatic Workspace folders](http://goo.gle/devtools-automatic-workspace-folders)
## Installation
```bash
npm i -D rsbuild-plugin-devtools-json
```
## Usage
Add it to your Rsbuild config:
```js
import { defineConfig } from "@rsbuild/core";
import { pluginDevtoolsJson } from "rsbuild-plugin-devtools-json";
export default defineConfig({
plugins: [
pluginDevtoolsJson(),
// ...
],
});
```
While the plugin can generate a UUID and save it in Rsbuild cache, you can also specify it in the options like in the following:
```js
pluginDevtoolsJson({
uuid: "6ec0bd7f-11c0-43da-975e-2a8ad9ebae0b",
});
```
You can also specify a custom root path for the DevTools project settings:
```js
pluginDevtoolsJson({
rootPath: "/path/to/custom/root",
});
```
This is particularly useful in monorepo setups, where you might want to set the root path to the monorepo root directory, especially when used with [rsbuild-plugin-source-build](https://github.com/rspack-contrib/rsbuild-plugin-source-build). If not provided, the default root path from Rsbuild context will be used.
The `/.well-known/appspecific/com.chrome.devtools.json` endpoint will serve the project settings as JSON with the following structure:
```json
{
"workspace": {
"root": "/path/to/project/root",
"uuid": "6ec0bd7f-11c0-43da-975e-2a8ad9ebae0b"
}
}
```
Here `root` is the absolute path to your `{projectRoot}` folder, and `uuid` is a random v4 UUID, generated the first time that you start the Rsbuild dev server with the plugin installed (it is henceforth cached in the Rsbuild cache folder).
## Credits
This plugin is inspired by [vite-plugin-devtools-json](https://github.com/ChromeDevTools/vite-plugin-devtools-json). Both the implementation and documentation have been adapted and referenced from the original Vite plugin.
## License
The code is under [MIT License](LICENSE).