vite-plugin-jsx-source-attrs 0.2.0 → 0.2.2-dev.mr.4.33.5c3d6c43

package/README.llm.txt

@@ -10,7 +10,7 @@
 
 - 개발 모드에서 intrinsic JSX 요소에 `data-source-location`을 주입한다.
 - 프로덕션 빌드에서는 주입하지 않는다.
-- 사용자 컴포넌트에는 기본적으로 주입하지 않는다.
+- 사용자 컴포넌트에는 기본적으로 `data-component-source-location`을 주입한다.
 - 기존 attribute가 있으면 중복 주입하지 않는다.
 - Vite 가상 모듈 prefix, query/hash, Windows 경로 구분자를 정규화한다.
 
@@ -55,7 +55,7 @@ Vite React 프로젝트에 `vite-plugin-jsx-source-attrs`를 설치하고 설정
 vitePluginJsxSourceAttrs({
   enabled: mode === 'development',
   attributeName: 'data-source-location',
-  componentAttributeName: null,
+  componentAttributeName: 'data-component-source-location',
 })
 ```
 
@@ -93,7 +93,7 @@ export default defineConfig(({ mode }) => ({
     vitePluginJsxSourceAttrs({
       enabled: mode === 'development',
       attributeName: 'data-source-location',
-      componentAttributeName: null,
+      componentAttributeName: 'data-component-source-location',
     }),
     react(),
   ],
@@ -206,7 +206,7 @@ export default defineConfig(({ mode }) => ({
           jsxSourceAttrs({
             enabled: mode === 'development',
             attributeName: 'data-source-location',
-            componentAttributeName: null,
+            componentAttributeName: 'data-component-source-location',
           }),
         ],
       },
@@ -244,7 +244,7 @@ export default defineConfig(({ mode }) => ({
         plugins: [
           jsxSourceAttrs({
             enabled: mode === 'development',
-            componentAttributeName: null,
+            componentAttributeName: 'data-component-source-location',
           }),
         ],
       },
@@ -276,7 +276,7 @@ react({
       existingPlugin,
       jsxSourceAttrs({
         enabled: mode === 'development',
-        componentAttributeName: null,
+        componentAttributeName: 'data-component-source-location',
       }),
     ],
   },
@@ -295,7 +295,7 @@ export default defineConfig(({ mode }) => ({
         plugins: [
           jsxSourceAttrs({
             enabled: mode === 'development',
-            componentAttributeName: null,
+            componentAttributeName: 'data-component-source-location',
           }),
         ],
       },
@@ -336,7 +336,7 @@ jsxSourceAttrs({
 jsxSourceAttrs({
   enabled: mode === 'development',
   root: process.cwd(),
-  componentAttributeName: null,
+  componentAttributeName: 'data-component-source-location',
 });
 ```
 
@@ -349,7 +349,7 @@ jsxSourceAttrs({
   enabled: ({ filename }) => {
     return filename.endsWith('.tsx') && !filename.includes('/node_modules/');
   },
-  componentAttributeName: null,
+  componentAttributeName: 'data-component-source-location',
 });
 ```
 
@@ -369,7 +369,7 @@ jsxSourceAttrs({
 1. `vite-plugin-jsx-source-attrs`를 devDependency로 설치한다.
 2. `vite.config.ts`에서 로컬 `jsx-source-attrs.js` import를 제거한다.
 3. `import { jsxSourceAttrs } from 'vite-plugin-jsx-source-attrs';`를 추가한다.
-4. `react({ babel: { plugins: [...] } })` 안에 `jsxSourceAttrs({ enabled: mode === 'development', componentAttributeName: null })`를 추가한다.
+4. `react({ babel: { plugins: [...] } })` 안에 `jsxSourceAttrs({ enabled: mode === 'development', componentAttributeName: 'data-component-source-location' })`를 추가한다.
 5. 기존 로컬 플러그인 파일은 import가 사라진 뒤 삭제한다.
 6. `@wix/babel-plugin-jsx-source-attrs`가 더 이상 필요 없다면 dependency/devDependency에서 제거한다.
 
@@ -457,7 +457,7 @@ export default defineConfig(({ mode }) => ({
           jsxSourceAttrs({
             enabled: mode === 'development',
             attributeName: 'data-source-location',
-            componentAttributeName: null,
+            componentAttributeName: 'data-component-source-location',
           }),
         ],
       },

package/README.md

@@ -8,8 +8,8 @@ Vite React 개발 환경에서 JSX 요소에 소스 위치 정보를 담은 attr
 
 - 개발 모드 JSX에 `data-source-location` attribute를 주입합니다.
 - 프로덕션 빌드 또는 비활성화 조건에서는 source attribute를 주입하지 않을 수 있습니다.
-- 기본값에서는 intrinsic JSX 요소(`div`, `span`, `my-element`)만 대상으로 합니다.
-- `componentAttributeName`을 지정하면 사용자 컴포넌트에도 별도 attribute를 주입할 수 있습니다.
+- 기본값에서는 intrinsic JSX 요소(`div`, `span`, `my-element`)에 `data-source-location`을, 사용자 컴포넌트에 `data-component-source-location`을 주입합니다.
+- `componentAttributeName: null`을 지정하면 사용자 컴포넌트에는 attribute를 주입하지 않습니다.
 - 파일 경로의 query/hash 제거, Vite 가상 모듈 prefix 제거, OS 경로 구분자 정규화를 제공합니다.
 - 이미 같은 이름의 attribute가 있으면 중복으로 주입하지 않습니다.
 
@@ -31,6 +31,59 @@ npm install -D vite-plugin-jsx-source-attrs
 
 프로덕션 빌드에서도 `vite.config.ts`를 평가해야 하므로 CI/CD가 `devDependencies`를 포함해 설치해야 합니다. `npm ci --omit=dev`처럼 devDependency를 제외한 상태에서 빌드를 실행하는 환경이라면 이 패키지를 찾을 수 없습니다. 이 경우 빌드 단계에서는 devDependency를 포함해 설치하고, 배포 런타임 이미지나 서버 산출물에서만 devDependency를 제외하세요.
 
+### LLM 적용 가이드 프롬프트
+
+다른 Vite React 프로젝트에 이 패키지를 설치하고 `vite.config.ts`까지 자동 반영하려면 아래 프롬프트를 LLM/AI 에이전트에게 그대로 전달하세요. 더 자세한 지침은 [`README.llm.txt`](README.llm.txt)를 참고하세요.
+
+````text
+Vite React 프로젝트에 `vite-plugin-jsx-source-attrs`를 설치하고 설정해줘.
+
+요구사항:
+1. 프로젝트 루트에서 패키지 매니저를 확인해줘.
+   - `packageManager` 필드가 있으면 해당 도구를 우선 사용해줘.
+   - `packageManager`가 없으면 lockfile 기준으로 판단해줘: `bun.lock` → Bun, `package-lock.json` → npm, `pnpm-lock.yaml` → pnpm, `yarn.lock` → Yarn.
+   - 그래도 판단할 수 없으면 npm을 사용해줘.
+2. `vite-plugin-jsx-source-attrs`를 devDependency로 설치해줘.
+   - stable 검증이면 `vite-plugin-jsx-source-attrs` 또는 `vite-plugin-jsx-source-attrs@latest`를 설치해줘.
+   - MR 검증본이 필요하면 `vite-plugin-jsx-source-attrs@dev`를 설치해줘.
+   - main prerelease 검증본이 필요하면 `vite-plugin-jsx-source-attrs@pre`를 설치해줘.
+3. `vite.config.ts` 또는 `vite.config.mts`를 찾아 `@vitejs/plugin-react`보다 앞에 `vitePluginJsxSourceAttrs()`를 추가해줘.
+4. 기존 `react()` 설정, 기존 Babel plugin, alias, server, build 설정은 보존해줘.
+5. 이미 `react({ babel: { plugins: [...] } })`를 지원하는 구버전 조합이면 `jsxSourceAttrs()`를 기존 Babel 플러그인 배열 끝에 추가해도 돼.
+6. Vite 8 + `@vitejs/plugin-react` 6처럼 `babel` 옵션이 없는 조합에서는 `react({ babel: ... })` 형태로 바꾸지 말고 Vite 플러그인 방식을 사용해줘.
+7. `defineConfig`가 객체 형태이고 `mode`가 필요하면 `defineConfig(({ mode }) => ({ ... }))` 형태로 바꿔줘. 단, 기존 설정 의미는 보존해줘.
+8. 기본 설정은 아래 값을 사용해줘.
+
+```ts
+vitePluginJsxSourceAttrs({
+  enabled: mode === 'development',
+  attributeName: 'data-source-location',
+  componentAttributeName: 'data-component-source-location',
+})
+```
+
+9. import를 추가해줘.
+
+```ts
+import { vitePluginJsxSourceAttrs } from 'vite-plugin-jsx-source-attrs';
+```
+
+10. 기존 로컬 JSX source attrs 플러그인이 있으면 새 패키지로 대체해줘.
+    - 제거 후보: `resources/scripts/jsx-source-attrs.js`, `resources/babel/jsx-source-attrs.js`, `src/resources/babel/jsx-source-attrs.js`, `@wix/babel-plugin-jsx-source-attrs` 직접 설정.
+    - 단, 실제 import가 제거된 뒤에만 파일/의존성을 삭제해줘.
+11. 빌드 단계에서는 devDependencies가 설치되어야 한다는 점을 CI 설정에서 확인해줘.
+12. 변경 후 프로젝트의 기존 검증 스크립트를 실행해줘.
+    - 가능한 경우: lint, typecheck, test, build 순서.
+    - 없는 스크립트는 억지로 만들지 말고 건너뛰었다고 보고해줘.
+13. 최종 보고에는 설치한 버전/tag, 수정한 파일, 실행한 검증 명령, 남은 주의사항을 요약해줘.
+
+주의사항:
+- unrelated 파일은 수정하지 마.
+- 기존 변경사항을 되돌리지 마.
+- 문자열/주석에 있는 예시는 실제 import나 실행 코드가 아니면 함부로 삭제하지 마.
+- 프로덕션 빌드 산출물에는 `data-source-location`이 없어야 해.
+````
+
 
 ## 사용법
 
@@ -46,7 +99,7 @@ export default defineConfig(({ mode }) => ({
     vitePluginJsxSourceAttrs({
       enabled: mode === 'development',
       attributeName: 'data-source-location',
-      componentAttributeName: null,
+      componentAttributeName: 'data-component-source-location',
     }),
     react(),
   ],
@@ -68,7 +121,7 @@ export default defineConfig(({ mode }) => ({
           jsxSourceAttrs({
             enabled: mode === 'development',
             attributeName: 'data-source-location',
-            componentAttributeName: null,
+            componentAttributeName: 'data-component-source-location',
           }),
         ],
       },
@@ -95,7 +148,7 @@ const view = <div data-source-location="src/App.tsx:1:14" />;
 | --- | --- | --- |
 | `enabled` | Babel: `process.env.NODE_ENV !== 'production'`, Vite: `command === 'serve'` | attribute 주입 여부입니다. boolean 또는 context 기반 함수로 지정할 수 있습니다. |
 | `attributeName` | `data-source-location` | intrinsic JSX 요소에 주입할 attribute 이름입니다. |
-| `componentAttributeName` | `null` | 사용자 컴포넌트에 별도로 주입할 attribute 이름입니다. `null`이면 사용자 컴포넌트에는 주입하지 않습니다. |
+| `componentAttributeName` | `data-component-source-location` | 사용자 컴포넌트에 별도로 주입할 attribute 이름입니다. `null`이면 사용자 컴포넌트에는 주입하지 않습니다. |
 | `root` | Babel: `process.cwd()`, Vite: `config.root` | 절대 경로를 상대 경로로 바꿀 기준 루트입니다. |
 | `normalizePath` | 내장 정규화 함수 | 파일 경로를 attribute 값에 맞게 정규화하는 함수입니다. |
 | `include` | `/\.[jt]sx(?:\?.*)?$/` | `vitePluginJsxSourceAttrs`에서만 사용합니다. 변환할 Vite module id 패턴입니다. |
@@ -110,12 +163,11 @@ jsxSourceAttrs({
 });
 ```
 
-### 사용자 컴포넌트 attribute 예시
+### 사용자 컴포넌트 attribute 비활성화 예시
 
 ```ts
 jsxSourceAttrs({
-  attributeName: 'data-source-location',
-  componentAttributeName: 'data-component-source-location',
+  componentAttributeName: null,
 });
 ```
 

package/dist/index.cjs

@@ -79,13 +79,14 @@ function normalizeSourcePath(filename, context) {
 
 // src/index.ts
 var DEFAULT_ATTRIBUTE_NAME = "data-source-location";
+var DEFAULT_COMPONENT_ATTRIBUTE_NAME = "data-component-source-location";
 var DEFAULT_INCLUDE_RE = /\.[jt]sx(?:\?.*)?$/;
 var DEFAULT_EXCLUDE_RE = /\/node_modules\//;
 function resolveOptions(options) {
   return {
     enabled: options.enabled ?? process.env.NODE_ENV !== "production",
     attributeName: options.attributeName ?? DEFAULT_ATTRIBUTE_NAME,
-    componentAttributeName: options.componentAttributeName ?? null,
+    componentAttributeName: options.componentAttributeName === void 0 ? DEFAULT_COMPONENT_ATTRIBUTE_NAME : options.componentAttributeName,
     root: import_node_path2.default.resolve(options.root ?? process.cwd()),
     normalizePath: options.normalizePath ?? normalizeSourcePath
   };

package/dist/index.d.cts

@@ -20,7 +20,7 @@ interface JsxSourceAttrsOptions {
     enabled?: boolean | ((context: JsxSourceAttrsContext) => boolean);
     /** intrinsic JSX 요소에 주입할 attribute 이름입니다. */
     attributeName?: string;
-    /** 사용자 컴포넌트에 주입할 attribute 이름입니다. `null`이면 주입하지 않습니다. */
+    /** 사용자 컴포넌트에 주입할 attribute 이름입니다. 기본값은 `data-component-source-location`이며, `null`이면 주입하지 않습니다. */
     componentAttributeName?: string | null;
     /** 절대 경로를 상대 경로로 바꿀 기준 루트입니다. */
     root?: string;

package/dist/index.d.ts

@@ -20,7 +20,7 @@ interface JsxSourceAttrsOptions {
     enabled?: boolean | ((context: JsxSourceAttrsContext) => boolean);
     /** intrinsic JSX 요소에 주입할 attribute 이름입니다. */
     attributeName?: string;
-    /** 사용자 컴포넌트에 주입할 attribute 이름입니다. `null`이면 주입하지 않습니다. */
+    /** 사용자 컴포넌트에 주입할 attribute 이름입니다. 기본값은 `data-component-source-location`이며, `null`이면 주입하지 않습니다. */
     componentAttributeName?: string | null;
     /** 절대 경로를 상대 경로로 바꿀 기준 루트입니다. */
     root?: string;

package/dist/index.js

@@ -42,13 +42,14 @@ function normalizeSourcePath(filename, context) {
 
 // src/index.ts
 var DEFAULT_ATTRIBUTE_NAME = "data-source-location";
+var DEFAULT_COMPONENT_ATTRIBUTE_NAME = "data-component-source-location";
 var DEFAULT_INCLUDE_RE = /\.[jt]sx(?:\?.*)?$/;
 var DEFAULT_EXCLUDE_RE = /\/node_modules\//;
 function resolveOptions(options) {
   return {
     enabled: options.enabled ?? process.env.NODE_ENV !== "production",
     attributeName: options.attributeName ?? DEFAULT_ATTRIBUTE_NAME,
-    componentAttributeName: options.componentAttributeName ?? null,
+    componentAttributeName: options.componentAttributeName === void 0 ? DEFAULT_COMPONENT_ATTRIBUTE_NAME : options.componentAttributeName,
     root: path2.resolve(options.root ?? process.cwd()),
     normalizePath: options.normalizePath ?? normalizeSourcePath
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-jsx-source-attrs",
-  "version": "0.2.0",
+  "version": "0.2.2-dev.mr.4.33.5c3d6c43",
   "description": "Vite React 개발 환경에서 JSX 요소에 소스 위치 attribute를 주입하는 Vite/Babel 플러그인",
   "type": "module",
   "license": "MIT",