mirror of
https://github.com/bytedance/deer-flow.git
synced 2026-09-16 09:38:41 +00:00
bdd68469c1
* Stabilize Windows frontend development startup Next.js Turbopack can infer a user-level workspace root and hit an internal Rust task panic on Windows. Keep the frontend root explicit and select Webpack on Windows while preserving Turbopack elsewhere. Constraint: The existing non-Windows development workflow should keep Turbopack. Rejected: Disable Turbopack on every platform | unnecessary performance regression. Confidence: high Scope-risk: narrow Reversibility: clean Directive: Revisit the Windows Webpack fallback after the upstream Turbopack panic is resolved. Tested: Prettier, ESLint, TypeScript, 139 frontend test files with 1060 tests, and Windows pnpm dev smoke test on port 3010. Not-tested: Production build and browser E2E suite. Related: #4957 * Make the frontend bundler fallback diagnosable Keep the Windows Webpack fallback while allowing local diagnosis to select either supported Next.js bundler. Resolve the Turbopack root through the Node 20-compatible URL API so the explicit workspace boundary remains effective across the declared Next.js engine range. Constraint: Windows defaults to Webpack because of the observed Turbopack panic, while non-Windows defaults to Turbopack. Rejected: Accept arbitrary bundler values | Next.js only supports the two explicit flags and invalid values should fail early. Confidence: high Scope-risk: narrow Reversibility: clean Directive: Revisit the default Windows fallback when the upstream TaskGuard issue is resolved; the override is intentionally retained for diagnosis. Tested: Frontend format, ESLint, TypeScript, 139-file/1062-test Rstest suite, target launcher tests, and next.config.js absolute-root load check. Not-tested: Production build and browser E2E suite.
154 lines
5.5 KiB
Markdown
154 lines
5.5 KiB
Markdown
# DeerFlow Frontend
|
|
|
|
Like the original DeerFlow 1.0, we would love to give the community a minimalistic and easy-to-use web interface with a more modern and flexible architecture.
|
|
|
|
## Tech Stack
|
|
|
|
- **Framework**: [Next.js 16](https://nextjs.org/) with [App Router](https://nextjs.org/docs/app)
|
|
- **UI**: [React 19](https://react.dev/), [Tailwind CSS 4](https://tailwindcss.com/), [Shadcn UI](https://ui.shadcn.com/), [MagicUI](https://magicui.design/) and [React Bits](https://reactbits.dev/)
|
|
- **AI Integration**: [LangGraph SDK](https://www.npmjs.com/package/@langchain/langgraph-sdk) and [Vercel AI Elements](https://vercel.com/ai-sdk/ai-elements)
|
|
|
|
## Quick Start
|
|
|
|
### Prerequisites
|
|
|
|
- Node.js 22+
|
|
- pnpm 10.26.2+
|
|
|
|
### Installation
|
|
|
|
```bash
|
|
# Install dependencies
|
|
pnpm install
|
|
|
|
# Copy environment variables
|
|
cp .env.example .env
|
|
# Edit .env with your configuration
|
|
```
|
|
|
|
### Development
|
|
|
|
```bash
|
|
# Start development server
|
|
pnpm dev
|
|
|
|
# The app will be available at http://localhost:3000
|
|
```
|
|
|
|
### Build & Test
|
|
|
|
```bash
|
|
# Type check
|
|
pnpm typecheck
|
|
|
|
# Check formatting
|
|
pnpm format
|
|
|
|
# Apply formatting
|
|
pnpm format:write
|
|
|
|
# Lint
|
|
pnpm lint
|
|
|
|
# Run unit tests
|
|
pnpm test
|
|
|
|
# One-time setup: install Playwright Chromium browser
|
|
pnpm exec playwright install chromium
|
|
|
|
# Run E2E tests (builds and starts production server automatically)
|
|
pnpm test:e2e
|
|
|
|
# Build for production
|
|
pnpm build
|
|
|
|
# Start production server
|
|
pnpm start
|
|
```
|
|
|
|
## Site Map
|
|
|
|
```
|
|
├── / # Landing page
|
|
├── /chats # Chat list
|
|
├── /chats/new # New chat page
|
|
└── /chats/[thread_id] # A specific chat page
|
|
```
|
|
|
|
## Configuration
|
|
|
|
### Environment Variables
|
|
|
|
Key environment variables (see `.env.example` for full list):
|
|
|
|
```bash
|
|
# Backend API URL (optional, uses local Next.js/nginx proxy by default)
|
|
NEXT_PUBLIC_BACKEND_BASE_URL="http://localhost:8001"
|
|
# LangGraph-compatible API URL (optional, uses local Next.js/nginx proxy by default)
|
|
NEXT_PUBLIC_LANGGRAPH_BASE_URL="http://localhost:8001/api"
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
tests/
|
|
├── e2e/ # E2E tests (Playwright, Chromium, mocked backend)
|
|
└── unit/ # Unit tests (mirrors src/ layout)
|
|
src/
|
|
├── app/ # Next.js App Router pages
|
|
│ ├── api/ # API routes
|
|
│ ├── showcase/ # Allowlisted public read-only demos
|
|
│ ├── workspace/ # Main workspace pages
|
|
│ └── mock/ # Mock/demo pages
|
|
├── components/ # React components
|
|
│ ├── ui/ # Reusable UI components
|
|
│ ├── workspace/ # Workspace-specific components
|
|
│ ├── landing/ # Landing page components
|
|
│ └── ai-elements/ # AI-related UI elements
|
|
├── core/ # Core business logic
|
|
│ ├── api/ # API client & data fetching
|
|
│ ├── artifacts/ # Artifact management
|
|
│ ├── config/ # App configuration
|
|
│ ├── i18n/ # Internationalization
|
|
│ ├── mcp/ # MCP integration
|
|
│ ├── messages/ # Message handling
|
|
│ ├── models/ # Data models & types
|
|
│ ├── settings/ # User settings
|
|
│ ├── skills/ # Skills system
|
|
│ ├── threads/ # Thread management
|
|
│ ├── todos/ # Todo system
|
|
│ └── utils/ # Utility functions
|
|
├── hooks/ # Custom React hooks
|
|
├── lib/ # Shared libraries & utilities
|
|
├── server/ # Server-side code
|
|
│ └── better-auth/ # Authentication setup and session helpers
|
|
└── styles/ # Global styles
|
|
```
|
|
|
|
## Scripts
|
|
|
|
| Command | Description |
|
|
| ------------------- | ------------------------------------------------------------------ |
|
|
| `pnpm dev` | Start development server (Webpack on Windows, Turbopack elsewhere) |
|
|
| `pnpm build` | Build for production |
|
|
| `pnpm start` | Start production server |
|
|
| `pnpm test` | Run unit tests with Rstest |
|
|
| `pnpm test:e2e` | Run E2E tests with Playwright |
|
|
| `pnpm format` | Check formatting with Prettier |
|
|
| `pnpm format:write` | Apply formatting with Prettier |
|
|
| `pnpm lint` | Run ESLint |
|
|
| `pnpm lint:fix` | Fix ESLint issues |
|
|
| `pnpm typecheck` | Run TypeScript type checking |
|
|
| `pnpm check` | Run both lint and typecheck |
|
|
|
|
## Development Notes
|
|
|
|
- Uses pnpm workspaces (see `packageManager` in package.json)
|
|
- Turbopack is used by default in development except on Windows, where Webpack avoids known Turbopack runtime instability. Set `DEER_FLOW_DEV_BUNDLER=turbo` or `DEER_FLOW_DEV_BUNDLER=webpack` to override the platform default for local diagnosis.
|
|
- Environment validation can be skipped with `SKIP_ENV_VALIDATION=1` (useful for Docker)
|
|
- Backend API URLs are optional; nginx proxy is used by default in development
|
|
|
|
## License
|
|
|
|
MIT License. See [LICENSE](../LICENSE) for details.
|