From 0b67aec7cab9669590d3875da8c0beda7997007b Mon Sep 17 00:00:00 2001
From: owjs3901 <owjs3901@gmail.com>
Date: Tue, 15 Sep 2026 15:00:50 +0900
Subject: [PATCH] docs(skill): reset-css needs no plugin configuration

The section added in #665 told readers to wire three settings for
`@devup-ui/reset-css`:

    plugins: [DevupUI({ include: ["@devup-ui/reset-css"] })],
    optimizeDeps: { exclude: ["@devup-ui/reset-css"] },
    ssr: { noExternal: ["@devup-ui/reset-css"] },

None of them are needed, and the claim that "the plugin has to be told to
process it or its classes are never emitted" is wrong.

The reset is a `globalCss()` call at the top level of the package's own module;
`resetCss()` is an empty function that exists only so the import survives
tree-shaking. So the single requirement is that the plugin transforms the
package inside `node_modules`, and `createNodeModulesExcludeRegex` already lets
`@devup-ui` and `@devup-editor` through unconditionally:

    const base = `node_modules(?!.*(${['@devup-ui', '@devup-editor', ...include]

`include` only appends to that list. `ssr.noExternal` is set from a
`/@devup-ui/` pattern, which matches the package for the same reason.

`apps/landing` is the proof: it imports `resetCss` in its root layout and its
`vite.config.ts` passes `DevupUI({ singleCss })` and nothing else.

The advice came from reading a downstream project that had added `include` and
inferring it was required. One observation of a redundant setting is not
evidence that the setting is needed, and the plugin source was three files away.
---
 SKILL.md | 27 ++++++++++++++++++++++-----
 1 file changed, 22 insertions(+), 5 deletions(-)

diff --git a/SKILL.md b/SKILL.md
index 13803ac2..cd0a4cd7 100644
--- a/SKILL.md
+++ b/SKILL.md
@@ -480,15 +480,32 @@ package you do not author**, such as an offline webfont package.
 
 ### `@devup-ui/reset-css`
 
-It is a package, so the plugin has to be told to process it or its classes are
-never emitted. With Vite the two resolver settings are needed as well:
+Install it and import it. **It needs no plugin configuration**, on any bundler:
+
+```tsx
+// app/layout.tsx
+import { resetCss } from "@devup-ui/reset-css";
+
+resetCss();
+```
 
 ```ts
-plugins: [DevupUI({ include: ["@devup-ui/reset-css"] })],
-optimizeDeps: { exclude: ["@devup-ui/reset-css"] },
-ssr: { noExternal: ["@devup-ui/reset-css"] },
+// vite.config.ts - nothing extra
+plugins: [DevupUI()];
 ```
 
+The reset is a `globalCss()` call at the top level of the package's own module,
+and `resetCss()` is an empty function that exists only so the import is not
+tree-shaken away. So the one thing that has to happen is that the plugin
+transforms the package inside `node_modules` — and every plugin already allows
+`@devup-ui` and `@devup-editor` through that exclusion unconditionally, with
+`include` only *adding* to that list. `ssr.noExternal` is set from a `/@devup-ui/`
+pattern for the same reason.
+
+Do not add `include`, `optimizeDeps.exclude` or `ssr.noExternal` entries for it.
+They are redundant, and writing them suggests to the next reader that a devup-ui
+package needs wiring when none does.
+
 ## What Decides Static Extraction
 
 One rule explains `Dynamic Values = CSS Variables`, `$token Scope` and