chore(brain): ASTRA 성장 자산 동기화 — 기능 인벤토리·growth(약점프로필/학습큐)·일화기억·장기기억·회의록 원문

2026-06-12 16:37:41 +09:00
parent a97fc7be07
commit 89fb05a28a
781 changed files with 138546 additions and 47 deletions
@@ -0,0 +1,191 @@
+---
+id: wiki-2026-0508-rollup
+title: Rollup
+category: 10_Wiki/Topics
+status: verified
+canonical_id: self
+aliases: [rollup-bundler, rollupjs]
+duplicate_of: none
+source_trust_level: A
+confidence_score: 0.9
+verification_status: applied
+tags: [bundler, build-tool, esm, library-build, frontend]
+raw_sources: []
+last_reinforced: 2026-05-10
+github_commit: pending
+tech_stack:
+  language: javascript
+  framework: rollup-4
+---
+
+# Rollup
+
+## 매 한 줄
+> **"매 ESM-first 의 module bundler 의 library-grade output 의 specialized."**. Rich Harris 의 2015 의 의 originated, 매 tree-shaking 의 pioneer — 매 2026 의 Rollup 4.x 의 매 SWC/Oxc-powered, library 의 publishing (NPM packages, SDKs) 의 의 default choice 이며, Vite 의 production build 의 underlying engine.
+
+## 매 핵심
+
+### 매 정의
+- ESM-native bundler — `import`/`export` 의 first-class.
+- Tree-shaking 의 pioneer (2015) — dead code elimination via static analysis.
+- Output formats: ESM, CJS, UMD, IIFE, AMD, SystemJS.
+- Plugin-driven — minimal core, everything via `@rollup/plugin-*`.
+
+### 매 vs. 다른 bundlers
+- **Vite (dev)**: Rollup 의 production 의 wraps — dev 의 esbuild + Rollup of build.
+- **webpack**: 매 application bundling 의 strong, code splitting 의 mature; Rollup 의 library output 의 cleaner.
+- **esbuild**: 10-100x faster, 그러나 plugin ecosystem 의 narrower.
+- **Bun.build / tsdown**: 2026 의 emerging, Rollup-compatible plugin API.
+
+### 매 응용
+1. NPM library publishing (React component lib, SDK, utils package).
+2. Multi-format output (ESM + CJS + types).
+3. Vite 의 production build (transitively).
+4. Storybook 의 build pipeline.
+
+## 💻 패턴
+
+### Library bundle (TS + multi-format)
+```js
+// rollup.config.js
+import typescript from '@rollup/plugin-typescript';
+import { nodeResolve } from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+import dts from 'rollup-plugin-dts';
+
+export default [
+  {
+    input: 'src/index.ts',
+    output: [
+      { file: 'dist/index.cjs', format: 'cjs', sourcemap: true },
+      { file: 'dist/index.mjs', format: 'esm', sourcemap: true },
+    ],
+    plugins: [nodeResolve(), commonjs(), typescript({ tsconfig: './tsconfig.build.json' })],
+    external: ['react', 'react-dom'],
+  },
+  {
+    input: 'src/index.ts',
+    output: [{ file: 'dist/index.d.ts', format: 'es' }],
+    plugins: [dts()],
+  },
+];
+```
+
+### `package.json` exports map
+```json
+{
+  "name": "@org/lib",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": ["dist"]
+}
+```
+
+### Tree-shaking 의 verify
+```js
+// rollup.config.js
+export default {
+  // ...
+  treeshake: {
+    moduleSideEffects: false, // aggressive — assume no side effects
+    propertyReadSideEffects: false,
+  },
+};
+```
+
+### Plugin: image inlining
+```js
+import image from '@rollup/plugin-image';
+import url from '@rollup/plugin-url';
+
+export default {
+  plugins: [
+    url({ limit: 8192 }), // inline <8kb as base64
+    image(),
+  ],
+};
+```
+
+### React component library
+```js
+import { babel } from '@rollup/plugin-babel';
+import postcss from 'rollup-plugin-postcss';
+
+export default {
+  input: 'src/index.tsx',
+  output: { dir: 'dist', format: 'esm', preserveModules: true },
+  external: ['react', 'react-dom', /^@radix-ui/],
+  plugins: [
+    postcss({ modules: true, extract: 'styles.css' }),
+    babel({ babelHelpers: 'bundled', presets: ['@babel/preset-react'] }),
+  ],
+};
+```
+
+### Watch mode + dev server
+```bash
+rollup -c -w
+# or use Vite which wraps Rollup for production
+vite build
+```
+
+### Code splitting (manual chunks)
+```js
+export default {
+  input: { main: 'src/main.ts', admin: 'src/admin.ts' },
+  output: {
+    dir: 'dist',
+    format: 'esm',
+    manualChunks: {
+      vendor: ['react', 'react-dom'],
+      utils: ['lodash-es', 'date-fns'],
+    },
+  },
+};
+```
+
+## 매 결정 기준
+| 상황 | Approach |
+|---|---|
+| Library / SDK publishing | **Rollup** (clean output, multi-format) |
+| Application bundle | **Vite** (Rollup 의 wraps) or webpack |
+| Speed-critical (CI) | **esbuild** or **tsdown** (Rolldown) |
+| Storybook / docs build | Rollup-based (Vite mode) |
+| Monorepo internal package | tsup (esbuild) or Rollup with `preserveModules` |
+
+**기본값**: library 의 의 Rollup, app 의 의 Vite (Rollup 의 production engine).
+
+## 🔗 Graph
+- 변형: [[Vite]] · [[tsup]]
+- 응용: [[Component-Library-Architecture]]
+- Adjacent: [[ESM]] · [[esbuild]]
+
+## 🤖 LLM 활용
+**언제**: NPM library publishing, multi-format output, clean ESM bundles, Vite production tuning.
+**언제 X**: large application bundling (Vite/webpack), HMR-heavy dev (Vite), Node.js server (no bundling needed in 2026 ESM).
+
+## ❌ 안티패턴
+- **Bundling peer deps**: `react`/`react-dom` 의 bundle 의 included — `external` 의 declare 의 필요.
+- **CJS-only output 의 ESM-only consumer**: 2026 의 ESM-first ecosystem — dual ESM+CJS output 의 ship.
+- **Source map 의 omission**: production debugging 의 impossible — `sourcemap: true` 의 default.
+- **Plugin order 의 ignorance**: `nodeResolve` before `commonjs` before `typescript` — order matters.
+- **Vite app 의 직접 의 Rollup config**: Vite 의 abstracts — `vite.config.ts` 의 `build.rollupOptions` 의 사용.
+
+## 🧪 검증 / 중복
+- Verified (rollupjs.org, Rollup 4.x docs 2026, Vite documentation).
+- 신뢰도 A.
+
+## 🕓 Changelog
+| 날짜 | 변경 |
+|---|---|
+| 2026-05-08 | Phase 1 |
+| 2026-05-10 | Manual cleanup — full bundler reference + 2026 ecosystem (Rolldown, tsup) |