Update nexus: fix conflicts and sync local changes
This commit is contained in:
Shen Wei
@@ -1,126 +1,126 @@
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [ai, cursor, ide, mcp]
|
||||
---
|
||||
|
||||
#ide #cursor #ai #mcp
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Cursor 2.0初学者使用指南
|
||||
|
||||
### 概述 🔍
|
||||
本视频面向初学者，系统讲解了Cursor 2.0这款集成了人工智能（AI）功能的代码编辑器的使用方法。视频首先介绍了Cursor的基本背景、安装及界面布局，继而阐述了最新特性与模型变更，详细示范了如何规划、生成及审查代码。通过示范制作一个简单的“Tetris”游戏和相关网页，帮助观众理解如何高效使用AI代理进行项目开发。讲解风格结合演示和实操，以通俗易懂的语言帮助初学者迅速上手，重点突出AI代码生成的核心功能和实用操作技巧。
|
||||
|
||||
## Youtube
|
||||
https://www.youtube.com/watch?v=l30Eb76Tk5s
|
||||
|
||||
## 核心知识点总结 ⏰
|
||||
- **00:00-01:25 安装与打开项目文件夹**
|
||||
- Cursor是基于VS Code的AI代码编辑器，可免费使用，支持付费升级以获取更多生成额度。
|
||||
- 登录账户后，需通过文件菜单打开或新建项目文件夹，确保代码文件有存储路径。
|
||||
|
||||
- **01:26-02:30 最新版本与AI模型介绍**
|
||||
- Cursor已运营约2年，持续升级用户界面和功能。
|
||||
- 新增了自有AI模型Composer，强调其速度优势（比类似模型快4倍）。
|
||||
- 支持多AI代理并行操作，提升代码生成效率。
|
||||
|
||||
- **02:31-04:00 界面主题与设置调整**
|
||||
- 可通过快捷键打开命令面板（Ctrl+Shift+P或Cmd+Shift+P）切换编辑器主题，例如Monokai。
|
||||
- 设置面板支持界面窗口自由拖拽、调整大小，满足用户个性化需求。
|
||||
|
||||
- **04:01-06:30 界面模式与视图切换介绍**
|
||||
- 主要有“编辑器视图”和“Agents（代理）视图”两大块，分别用于代码文件编辑和AI代理交互。
|
||||
- 界面左上角一组切换按钮控制左侧边栏、终端等模块显示。
|
||||
- 了解这些视图和控制按钮，有助于快速定位所需功能和编程场景。
|
||||
|
||||
- **06:31-09:30 规划代码开发思路的重要性及基本用法示范**
|
||||
- 强调在向AI代理发出生成代码请求前，需明确项目目标（如网站、游戏、后端工具）。
|
||||
- 通过语音输入演示让AI生成“Tetris”游戏开发的计划，得到任务列表。
|
||||
- 计划文件通常以Markdown形式展示，用户可修改或重新生成计划。
|
||||
|
||||
- **09:31-13:30 代码生成与多代理并行使用**
|
||||
- 启动构建任务时生成新代理，执行计划步骤。
|
||||
- 多代理功能可以同时运行不同任务，互不干扰。
|
||||
- 代理工作模式包括Plan（规划）、Agent（执行）、Ask（咨询）三种，Ask模式安全，仅返回文本不改动文件。
|
||||
|
||||
- **13:31-16:30 代码审查与版本控制流程**
|
||||
- 生成代码后进入“待审查”状态，可使用“Diff”功能查看具体改动，支持文件逐个审查或整体接收。
|
||||
- 代码改动一旦生成即写入文件，未点击“撤销”按钮前持续保留，需确保先测试代码再确认保存。
|
||||
- 推荐结合Git版本控制，帮助管理和回滚代码变更，降低风险。
|
||||
|
||||
- **16:31-19:30 细粒度代码编辑与上下文引用**
|
||||
- 支持选中文本后快速编辑（如加注释），并可通过快捷键引用代码片段与文件上下文向代理提问，方便理解和定向修改。
|
||||
- AI支持内置代码自动补全，使用Tab键快速接受提示，提高代码书写效率。
|
||||
|
||||
- **19:31-23:50 多任务代理管理与项目规则自定义**
|
||||
- 新建代理用于不同任务场景，保证上下文不冲突。
|
||||
- 演示创建独立页面广告“Play”按钮，增强项目模块化管理。
|
||||
- 可以设定“项目规则”，如强制AI为函数生成文档注释，实现代码规范自动化。
|
||||
|
||||
- **23:51-26:20 版本控制基础与自动化提交演示**
|
||||
- 介绍Git版本控制的重要概念及操作，建议用户学习以避免开发过程中的代码丢失与错误。
|
||||
- AI可自动初始化Git仓库并提交代码，为项目维护带来智能便捷。
|
||||
|
||||
- **26:21-27:10 附加功能简介：MCP服务器及工具集成**
|
||||
- MCP（Model Context Protocol）支持将外部工具和服务集成到AI代理，扩展功能范围。
|
||||
- 演示添加和切换MCP服务器，提升开发项目的扩展性和操作能力。
|
||||
|
||||
## 关键术语与定义 📚
|
||||
- **Cursor 2.0**：基于VS Code的AI增强代码编辑器，支持AI模型辅助代码生成及多任务代理操作。
|
||||
- **AI代理（Agent）**：基于AI模型的自动化任务助手，可以按模式生成代码、规划任务或回答疑问。
|
||||
- **Composer模型**：Cursor自研AI模型，主打生成速度快于其他同类模型。
|
||||
- **Diff文件**：显示代码改动对比的视图，帮助开发者快速审查AI修改的内容。
|
||||
- **Git**：主流版本控制系统，记录项目代码的历史版本变化，支持代码回滚和团队协同。
|
||||
- **Markdown文件（.md）**：兼容纯文本且可格式化的文档文件格式，常用于代码计划及说明文档。
|
||||
- **MCP服务器**：可集成外部API和工具的协议平台，赋予AI代理更丰富的执行能力。
|
||||
|
||||
## 推理结构 🔢
|
||||
1. **需求明确 → 规划任务 → AI生成计划**
|
||||
- 明确项目类型和预期结果是生成有效代码的前提。
|
||||
- 使用计划模式，让AI拆解步骤，形成清晰的开发路线图。
|
||||
2. **计划执行 → 代码生成 → 代码审查和测试**
|
||||
- AI代理执行计划任务，逐步生成代码。
|
||||
- 通过Diff文件和运行测试，确认代码质量。
|
||||
3. **修正与迭代 → 版本控制 → 项目维护**
|
||||
- 根据测试反馈调整代码。
|
||||
- 结合Git管理项目版本，确保稳定可靠。
|
||||
|
||||
## 示例解析 💡
|
||||
- **通过语音输入生成开发计划**：利用“Whisper Flow”音频工具直接对AI代理发出口述请求，生成简易Tetris游戏开发计划，帮助初学者体验从想法到实施的流程。
|
||||
- **多代理并行任务**：一边由一个代理执行游戏开发，另一边新建代理创建游戏的独立Landing Page，通过实战演示展示多线程开发优势。
|
||||
- **规则文件应用示范**：设定“函数必须生成Doc字符串”的规则，实现代码统一风格，保证代码规范性自动执行。
|
||||
|
||||
## 易错点提醒 ⚠️
|
||||
- **盲目接受代码**：误以为“Keep All”后代码才生成，实际上代码生成即写入文件，先测试再保存避免问题。
|
||||
- **忽视版本控制**：不使用Git版本控制可能导致无法回滚代码，尤其是AI生成的代码出现错误时难以恢复。
|
||||
- **代理模式混淆**：Agent模式会修改代码，Ask模式仅提供文本答案，不会改动代码，需根据需求选择。
|
||||
- **多代理上下文混用**：在同一个代理内继续先前任务效果更佳，分散任务需创建新代理避免上下文混乱。
|
||||
|
||||
## 快速复习技巧/自测题 🎯
|
||||
**复习技巧（无答案）**
|
||||
- 解释Cursor中Plan模式、Agent模式和Ask模式的区别。
|
||||
- 描述如何使用Diff视图查看AI生成的代码改动。
|
||||
- 列出在生成代码前需要规划的关键项目问题。
|
||||
|
||||
**自测题（含答案）**
|
||||
1. **问：如何在Cursor中切换编辑器主题？**
|
||||
答：使用快捷键Ctrl+Shift+P或Cmd+Shift+P打开命令面板，输入“theme”，选择“Preferences: Color Theme”来切换。
|
||||
|
||||
2. **问：Cursor中如何撤销AI生成的代码？**
|
||||
答：点击“Undo All”按钮撤销所有AI生成的改动，注意关闭文件或多次修改后可能无法撤销。
|
||||
|
||||
3. **问：Git在项目管理中的核心作用是什么？**
|
||||
答：Git用于版本控制，能记录代码变更历史，方便回滚和多人协作。
|
||||
|
||||
4. **问：如果想让AI自动为每个函数生成文档注释，应如何操作？**
|
||||
答：新增项目规则文件，写入“Always generate doc strings for functions”的规则，AI会自动遵守。
|
||||
|
||||
## 总结回顾 🔄
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [ai, cursor, ide, mcp]
|
||||
---
|
||||
|
||||
#ide #cursor #ai #mcp
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Cursor 2.0初学者使用指南
|
||||
|
||||
### 概述 🔍
|
||||
本视频面向初学者，系统讲解了Cursor 2.0这款集成了人工智能（AI）功能的代码编辑器的使用方法。视频首先介绍了Cursor的基本背景、安装及界面布局，继而阐述了最新特性与模型变更，详细示范了如何规划、生成及审查代码。通过示范制作一个简单的“Tetris”游戏和相关网页，帮助观众理解如何高效使用AI代理进行项目开发。讲解风格结合演示和实操，以通俗易懂的语言帮助初学者迅速上手，重点突出AI代码生成的核心功能和实用操作技巧。
|
||||
|
||||
## Youtube
|
||||
https://www.youtube.com/watch?v=l30Eb76Tk5s
|
||||
|
||||
## 核心知识点总结 ⏰
|
||||
- **00:00-01:25 安装与打开项目文件夹**
|
||||
- Cursor是基于VS Code的AI代码编辑器，可免费使用，支持付费升级以获取更多生成额度。
|
||||
- 登录账户后，需通过文件菜单打开或新建项目文件夹，确保代码文件有存储路径。
|
||||
|
||||
- **01:26-02:30 最新版本与AI模型介绍**
|
||||
- Cursor已运营约2年，持续升级用户界面和功能。
|
||||
- 新增了自有AI模型Composer，强调其速度优势（比类似模型快4倍）。
|
||||
- 支持多AI代理并行操作，提升代码生成效率。
|
||||
|
||||
- **02:31-04:00 界面主题与设置调整**
|
||||
- 可通过快捷键打开命令面板（Ctrl+Shift+P或Cmd+Shift+P）切换编辑器主题，例如Monokai。
|
||||
- 设置面板支持界面窗口自由拖拽、调整大小，满足用户个性化需求。
|
||||
|
||||
- **04:01-06:30 界面模式与视图切换介绍**
|
||||
- 主要有“编辑器视图”和“Agents（代理）视图”两大块，分别用于代码文件编辑和AI代理交互。
|
||||
- 界面左上角一组切换按钮控制左侧边栏、终端等模块显示。
|
||||
- 了解这些视图和控制按钮，有助于快速定位所需功能和编程场景。
|
||||
|
||||
- **06:31-09:30 规划代码开发思路的重要性及基本用法示范**
|
||||
- 强调在向AI代理发出生成代码请求前，需明确项目目标（如网站、游戏、后端工具）。
|
||||
- 通过语音输入演示让AI生成“Tetris”游戏开发的计划，得到任务列表。
|
||||
- 计划文件通常以Markdown形式展示，用户可修改或重新生成计划。
|
||||
|
||||
- **09:31-13:30 代码生成与多代理并行使用**
|
||||
- 启动构建任务时生成新代理，执行计划步骤。
|
||||
- 多代理功能可以同时运行不同任务，互不干扰。
|
||||
- 代理工作模式包括Plan（规划）、Agent（执行）、Ask（咨询）三种，Ask模式安全，仅返回文本不改动文件。
|
||||
|
||||
- **13:31-16:30 代码审查与版本控制流程**
|
||||
- 生成代码后进入“待审查”状态，可使用“Diff”功能查看具体改动，支持文件逐个审查或整体接收。
|
||||
- 代码改动一旦生成即写入文件，未点击“撤销”按钮前持续保留，需确保先测试代码再确认保存。
|
||||
- 推荐结合Git版本控制，帮助管理和回滚代码变更，降低风险。
|
||||
|
||||
- **16:31-19:30 细粒度代码编辑与上下文引用**
|
||||
- 支持选中文本后快速编辑（如加注释），并可通过快捷键引用代码片段与文件上下文向代理提问，方便理解和定向修改。
|
||||
- AI支持内置代码自动补全，使用Tab键快速接受提示，提高代码书写效率。
|
||||
|
||||
- **19:31-23:50 多任务代理管理与项目规则自定义**
|
||||
- 新建代理用于不同任务场景，保证上下文不冲突。
|
||||
- 演示创建独立页面广告“Play”按钮，增强项目模块化管理。
|
||||
- 可以设定“项目规则”，如强制AI为函数生成文档注释，实现代码规范自动化。
|
||||
|
||||
- **23:51-26:20 版本控制基础与自动化提交演示**
|
||||
- 介绍Git版本控制的重要概念及操作，建议用户学习以避免开发过程中的代码丢失与错误。
|
||||
- AI可自动初始化Git仓库并提交代码，为项目维护带来智能便捷。
|
||||
|
||||
- **26:21-27:10 附加功能简介：MCP服务器及工具集成**
|
||||
- MCP（Model Context Protocol）支持将外部工具和服务集成到AI代理，扩展功能范围。
|
||||
- 演示添加和切换MCP服务器，提升开发项目的扩展性和操作能力。
|
||||
|
||||
## 关键术语与定义 📚
|
||||
- **Cursor 2.0**：基于VS Code的AI增强代码编辑器，支持AI模型辅助代码生成及多任务代理操作。
|
||||
- **AI代理（Agent）**：基于AI模型的自动化任务助手，可以按模式生成代码、规划任务或回答疑问。
|
||||
- **Composer模型**：Cursor自研AI模型，主打生成速度快于其他同类模型。
|
||||
- **Diff文件**：显示代码改动对比的视图，帮助开发者快速审查AI修改的内容。
|
||||
- **Git**：主流版本控制系统，记录项目代码的历史版本变化，支持代码回滚和团队协同。
|
||||
- **Markdown文件（.md）**：兼容纯文本且可格式化的文档文件格式，常用于代码计划及说明文档。
|
||||
- **MCP服务器**：可集成外部API和工具的协议平台，赋予AI代理更丰富的执行能力。
|
||||
|
||||
## 推理结构 🔢
|
||||
1. **需求明确 → 规划任务 → AI生成计划**
|
||||
- 明确项目类型和预期结果是生成有效代码的前提。
|
||||
- 使用计划模式，让AI拆解步骤，形成清晰的开发路线图。
|
||||
2. **计划执行 → 代码生成 → 代码审查和测试**
|
||||
- AI代理执行计划任务，逐步生成代码。
|
||||
- 通过Diff文件和运行测试，确认代码质量。
|
||||
3. **修正与迭代 → 版本控制 → 项目维护**
|
||||
- 根据测试反馈调整代码。
|
||||
- 结合Git管理项目版本，确保稳定可靠。
|
||||
|
||||
## 示例解析 💡
|
||||
- **通过语音输入生成开发计划**：利用“Whisper Flow”音频工具直接对AI代理发出口述请求，生成简易Tetris游戏开发计划，帮助初学者体验从想法到实施的流程。
|
||||
- **多代理并行任务**：一边由一个代理执行游戏开发，另一边新建代理创建游戏的独立Landing Page，通过实战演示展示多线程开发优势。
|
||||
- **规则文件应用示范**：设定“函数必须生成Doc字符串”的规则，实现代码统一风格，保证代码规范性自动执行。
|
||||
|
||||
## 易错点提醒 ⚠️
|
||||
- **盲目接受代码**：误以为“Keep All”后代码才生成，实际上代码生成即写入文件，先测试再保存避免问题。
|
||||
- **忽视版本控制**：不使用Git版本控制可能导致无法回滚代码，尤其是AI生成的代码出现错误时难以恢复。
|
||||
- **代理模式混淆**：Agent模式会修改代码，Ask模式仅提供文本答案，不会改动代码，需根据需求选择。
|
||||
- **多代理上下文混用**：在同一个代理内继续先前任务效果更佳，分散任务需创建新代理避免上下文混乱。
|
||||
|
||||
## 快速复习技巧/自测题 🎯
|
||||
**复习技巧（无答案）**
|
||||
- 解释Cursor中Plan模式、Agent模式和Ask模式的区别。
|
||||
- 描述如何使用Diff视图查看AI生成的代码改动。
|
||||
- 列出在生成代码前需要规划的关键项目问题。
|
||||
|
||||
**自测题（含答案）**
|
||||
1. **问：如何在Cursor中切换编辑器主题？**
|
||||
答：使用快捷键Ctrl+Shift+P或Cmd+Shift+P打开命令面板，输入“theme”，选择“Preferences: Color Theme”来切换。
|
||||
|
||||
2. **问：Cursor中如何撤销AI生成的代码？**
|
||||
答：点击“Undo All”按钮撤销所有AI生成的改动，注意关闭文件或多次修改后可能无法撤销。
|
||||
|
||||
3. **问：Git在项目管理中的核心作用是什么？**
|
||||
答：Git用于版本控制，能记录代码变更历史，方便回滚和多人协作。
|
||||
|
||||
4. **问：如果想让AI自动为每个函数生成文档注释，应如何操作？**
|
||||
答：新增项目规则文件，写入“Always generate doc strings for functions”的规则，AI会自动遵守。
|
||||
|
||||
## 总结回顾 🔄
|
||||
Cursor 2.0是一款强大的AI代码协助编辑器，融合了先进的AI模型Composer，支持多代理任务并行和多模式交互。通过明确项目目标制定开发计划，结合代码生成、代码审查与版本控制流程，用户可以高效地实现项目开发。其灵活的界面设置、丰富的辅助功能如语音输入、上下文引用及规则配置进一步提升用户体验。理解不同代理模式和审查机制是避免误操作的关键，熟练使用Git版本控制则能实现代码稳定可靠的管理。整体来看，Cursor 2.0为开发者提供了一条从想法到实现的智能化路径，是现代AI辅助编程的重要工具之一。
|
||||
@@ -1,192 +1,192 @@
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [remote-ssh, trae, ubuntu]
|
||||
---
|
||||
|
||||
|
||||
#trae #ubuntu #remote-ssh
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
### 1. 整体架构图示
|
||||
|
||||
- **Ubuntu 2 (Dev Server):** 存放源码，运行 `tiktok_pm` 容器（代码挂载），Trae 通过 SSH 远程连接此处。
|
||||
|
||||
- **Ubuntu 1 (Prod Server):** 运行 `tiktok_pm` 容器（镜像打包），通过 Docker 卷持久化数据，不挂载源码。
|
||||
|
||||
- **ThinkBook (Local):** 仅作为 UI 端，通过 Trae 连接 Ubuntu 2 进行开发。
|
||||
|
||||
### 2. Ubuntu 2：开发环境配置 (Dev)
|
||||
|
||||
这是您主要的工作区。路径：`/home/shenwei/docker/tiktok_pm`
|
||||
|
||||
#### A. 目录结构
|
||||
|
||||
``` bash
|
||||
/home/shenwei/docker/tiktok_pm/
|
||||
├── src/ # Django 源代码仓库
|
||||
├── docker-compose.yml # 开发环境 Compose
|
||||
├── .env.dev # 开发环境变量
|
||||
└── Dockerfile # 开发/生产共用基础镜像定义
|
||||
```
|
||||
|
||||
#### B. 开发环境 `docker-compose.yml`
|
||||
|
||||
开发环境的核心在于 **Bind Mount**（绑定挂载），实现代码修改实时生效。
|
||||
|
||||
### 3. 具体配置 (ThinkBook)
|
||||
#### 第一阶段：基础设施层配置 (Connectivity & Permissions)
|
||||
|
||||
在配置 IDE 之前，必须确保 SSH 连接是免密的，并且你的 Ubuntu 用户有权直接操作 Docker，否则 Trae 的远程插件会因为权限弹窗而连接失败或功能受限。
|
||||
|
||||
##### 1. 配置 SSH 免密登录 (本地机器 -> Ubuntu2 Server)
|
||||
|
||||
Trae 的远程连接依赖于非交互式登录。
|
||||
|
||||
- **本地机器（客户端）生成密钥对**（如果已有可跳过）：
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
ssh-keygen -t rsa -b 4096
|
||||
```
|
||||
|
||||
- **将公钥上传至 Ubuntu2 Server**：
|
||||
```
|
||||
# 替换 user 和 ip
|
||||
ssh-copy-id -i ~/.ssh/id_rsa.pub shenwei@192.168.3.45
|
||||
```
|
||||
|
||||
- **配置 SSH Config 文件**（推荐）： 在本地 `~/.ssh/config` (Mac/Linux) 或 `%USERPROFILE%\.ssh\config` (Windows) 中添加别名，方便 Trae 读取。
|
||||
|
||||
```
|
||||
Host ubuntu2
|
||||
HostName 192.168.3.45
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu2-ext # 公网访问
|
||||
HostName ubuntu2.ishenwei.online:60024
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu1
|
||||
HostName 192.168.3.47
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu1-ext # 公网访问
|
||||
HostName ubuntu1.ishenwei.online:60022
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
```
|
||||
|
||||
在 Ubuntu Server 上，你的用户必须在 `docker` 用户组中，否则 Trae 无法列出容器。
|
||||
|
||||
- **SSH 登录服务器执行：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
sudo usermod -aG docker $USER
|
||||
# 必须注销并重新登录，或执行以下命令使组变更立即生效
|
||||
newgrp docker
|
||||
```
|
||||
|
||||
- **验证：** 执行 `docker ps`，如果不需要 sudo 且能列出容器，则配置成功。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第二阶段：Trae 客户端配置 (IDE Setup)
|
||||
|
||||
Trae 原生支持 VS Code 的插件生态，我们需要利用 Remote Development 能力。
|
||||
|
||||
##### 1. 安装 Trae 及必要插件
|
||||
|
||||
打开 Trae，在左侧扩展市场（Extensions）中搜索并安装（如果尚未预装）：
|
||||
|
||||
- **Remote - SSH** (必装)
|
||||
|
||||
- **Docker** (Microsoft 出品，必装)
|
||||
|
||||
- **Dev Containers** (如果你计划使用 `.devcontainer` 模式开发，强烈推荐)
|
||||
|
||||
|
||||
##### 2. 建立远程连接
|
||||
|
||||
1. 使用快捷键 `Ctrl/Cmd + Shift + P` 调出命令面板。
|
||||
|
||||
2. 输入并选择：`Remote-SSH: Connect to Host...`。
|
||||
|
||||
3. 选择你在 SSH Config 中配置的 `ubuntu2`。
|
||||
|
||||
4. Trae 会在远程服务器上安装 **VS Code Server (Trae Server)** 代理组件。首次连接需要几十秒。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第三阶段：开发模式选择 (Workflow Configuration)
|
||||
|
||||
针对 Docker 项目，你有两种主要的开发模式，根据你的需求选择：
|
||||
|
||||
##### 模式 A：Attach 到正在运行的容器 (推荐用于调试)
|
||||
|
||||
这种模式下，你直接“进入”已经在 Ubuntu 上跑起来的 Docker 容器进行代码修改。
|
||||
|
||||
1. **连接成功后**，在 Trae 左侧侧边栏找到 **Docker** 图标。
|
||||
|
||||
2. 在 **Containers** 列表中，找到你的目标项目容器。
|
||||
|
||||
3. 右键点击该容器，选择 **"Attach Visual Studio Code"** (或 Trae 对应选项)。
|
||||
|
||||
4. Trae 会打开一个新的窗口，此时你的 IDE **实际上是运行在 Docker 容器内部**。
|
||||
|
||||
5. **优点**：环境完全隔离，直接使用容器内的 Python/Node/Go 环境，无需在 Ubuntu 宿主机安装语言环境。
|
||||
|
||||
|
||||
##### 模式 B：远程编辑宿主机文件 + Docker CLI (推荐用于编排)
|
||||
|
||||
这种模式下，你编辑的是 Ubuntu 文件系统上的代码 (`/home/user/project`)，但在终端调用 Docker 命令。
|
||||
|
||||
1. **连接成功后**，点击 "Open Folder"。
|
||||
|
||||
2. 选择 Ubuntu 上 `docker-compose.yml` 或项目代码所在的路径。
|
||||
|
||||
3. 打开终端 (`Ctrl + ~`)，直接执行 `docker compose up -d` 等命令。
|
||||
|
||||
4. **优点**：适合管理 `docker-compose.yml` 文件本身，或者同时管理多个微服务容器的配置。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第四阶段：解决常见“坑” (Troubleshooting)
|
||||
|
||||
根据经验，在内网开发 Docker 项目常遇到以下问题，请提前规避：
|
||||
|
||||
1. **Git 凭证问题**：
|
||||
|
||||
- 如果在容器内开发（模式 A），容器内可能没有你的 SSH Key 或 Git 配置。
|
||||
|
||||
- **解决**：Trae/VS Code 通常会自动转发本地的 SSH Agent。确保本地运行了 SSH Agent (`eval "$(ssh-agent -s)" && ssh-add`)，这样容器内拉取代码使用的是你本地的 Key。
|
||||
|
||||
2. **文件权限 (UID/GID) 问题**：
|
||||
|
||||
- 如果使用 Volume 挂载（将 Ubuntu 目录挂载进容器），容器内生成的 Build 文件可能归属于 `root`，导致你在宿主机无法删除或修改。
|
||||
|
||||
- **解决**：在 Dockerfile 中创建与宿主机相同 UID 的用户，或在 `docker-compose.yml` 中指定 `user: "${UID}:${GID}"`。
|
||||
|
||||
3. **内网穿透 (如果不只是局域网)**：
|
||||
|
||||
- 如果你离开办公地点，需要从公网访问这个内网 Server。
|
||||
|
||||
- **建议**：不要直接暴露 SSH 端口。在 Ubuntu 上安装 **Tailscale** 或 **Cloudflare Tunnel**。
|
||||
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [remote-ssh, trae, ubuntu]
|
||||
---
|
||||
|
||||
|
||||
#trae #ubuntu #remote-ssh
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
### 1. 整体架构图示
|
||||
|
||||
- **Ubuntu 2 (Dev Server):** 存放源码，运行 `tiktok_pm` 容器（代码挂载），Trae 通过 SSH 远程连接此处。
|
||||
|
||||
- **Ubuntu 1 (Prod Server):** 运行 `tiktok_pm` 容器（镜像打包），通过 Docker 卷持久化数据，不挂载源码。
|
||||
|
||||
- **ThinkBook (Local):** 仅作为 UI 端，通过 Trae 连接 Ubuntu 2 进行开发。
|
||||
|
||||
### 2. Ubuntu 2：开发环境配置 (Dev)
|
||||
|
||||
这是您主要的工作区。路径：`/home/shenwei/docker/tiktok_pm`
|
||||
|
||||
#### A. 目录结构
|
||||
|
||||
``` bash
|
||||
/home/shenwei/docker/tiktok_pm/
|
||||
├── src/ # Django 源代码仓库
|
||||
├── docker-compose.yml # 开发环境 Compose
|
||||
├── .env.dev # 开发环境变量
|
||||
└── Dockerfile # 开发/生产共用基础镜像定义
|
||||
```
|
||||
|
||||
#### B. 开发环境 `docker-compose.yml`
|
||||
|
||||
开发环境的核心在于 **Bind Mount**（绑定挂载），实现代码修改实时生效。
|
||||
|
||||
### 3. 具体配置 (ThinkBook)
|
||||
#### 第一阶段：基础设施层配置 (Connectivity & Permissions)
|
||||
|
||||
在配置 IDE 之前，必须确保 SSH 连接是免密的，并且你的 Ubuntu 用户有权直接操作 Docker，否则 Trae 的远程插件会因为权限弹窗而连接失败或功能受限。
|
||||
|
||||
##### 1. 配置 SSH 免密登录 (本地机器 -> Ubuntu2 Server)
|
||||
|
||||
Trae 的远程连接依赖于非交互式登录。
|
||||
|
||||
- **本地机器（客户端）生成密钥对**（如果已有可跳过）：
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
ssh-keygen -t rsa -b 4096
|
||||
```
|
||||
|
||||
- **将公钥上传至 Ubuntu2 Server**：
|
||||
```
|
||||
# 替换 user 和 ip
|
||||
ssh-copy-id -i ~/.ssh/id_rsa.pub shenwei@192.168.3.45
|
||||
```
|
||||
|
||||
- **配置 SSH Config 文件**（推荐）： 在本地 `~/.ssh/config` (Mac/Linux) 或 `%USERPROFILE%\.ssh\config` (Windows) 中添加别名，方便 Trae 读取。
|
||||
|
||||
```
|
||||
Host ubuntu2
|
||||
HostName 192.168.3.45
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu2-ext # 公网访问
|
||||
HostName ubuntu2.ishenwei.online:60024
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu1
|
||||
HostName 192.168.3.47
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
Host ubuntu1-ext # 公网访问
|
||||
HostName ubuntu1.ishenwei.online:60022
|
||||
User shenwei
|
||||
Port 22
|
||||
IdentityFile "C:\Users\ishenwei\.ssh\id_rsa" # 你的私钥路径
|
||||
```
|
||||
|
||||
在 Ubuntu Server 上，你的用户必须在 `docker` 用户组中，否则 Trae 无法列出容器。
|
||||
|
||||
- **SSH 登录服务器执行：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
sudo usermod -aG docker $USER
|
||||
# 必须注销并重新登录，或执行以下命令使组变更立即生效
|
||||
newgrp docker
|
||||
```
|
||||
|
||||
- **验证：** 执行 `docker ps`，如果不需要 sudo 且能列出容器，则配置成功。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第二阶段：Trae 客户端配置 (IDE Setup)
|
||||
|
||||
Trae 原生支持 VS Code 的插件生态，我们需要利用 Remote Development 能力。
|
||||
|
||||
##### 1. 安装 Trae 及必要插件
|
||||
|
||||
打开 Trae，在左侧扩展市场（Extensions）中搜索并安装（如果尚未预装）：
|
||||
|
||||
- **Remote - SSH** (必装)
|
||||
|
||||
- **Docker** (Microsoft 出品，必装)
|
||||
|
||||
- **Dev Containers** (如果你计划使用 `.devcontainer` 模式开发，强烈推荐)
|
||||
|
||||
|
||||
##### 2. 建立远程连接
|
||||
|
||||
1. 使用快捷键 `Ctrl/Cmd + Shift + P` 调出命令面板。
|
||||
|
||||
2. 输入并选择：`Remote-SSH: Connect to Host...`。
|
||||
|
||||
3. 选择你在 SSH Config 中配置的 `ubuntu2`。
|
||||
|
||||
4. Trae 会在远程服务器上安装 **VS Code Server (Trae Server)** 代理组件。首次连接需要几十秒。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第三阶段：开发模式选择 (Workflow Configuration)
|
||||
|
||||
针对 Docker 项目，你有两种主要的开发模式，根据你的需求选择：
|
||||
|
||||
##### 模式 A：Attach 到正在运行的容器 (推荐用于调试)
|
||||
|
||||
这种模式下，你直接“进入”已经在 Ubuntu 上跑起来的 Docker 容器进行代码修改。
|
||||
|
||||
1. **连接成功后**，在 Trae 左侧侧边栏找到 **Docker** 图标。
|
||||
|
||||
2. 在 **Containers** 列表中，找到你的目标项目容器。
|
||||
|
||||
3. 右键点击该容器，选择 **"Attach Visual Studio Code"** (或 Trae 对应选项)。
|
||||
|
||||
4. Trae 会打开一个新的窗口，此时你的 IDE **实际上是运行在 Docker 容器内部**。
|
||||
|
||||
5. **优点**：环境完全隔离，直接使用容器内的 Python/Node/Go 环境，无需在 Ubuntu 宿主机安装语言环境。
|
||||
|
||||
|
||||
##### 模式 B：远程编辑宿主机文件 + Docker CLI (推荐用于编排)
|
||||
|
||||
这种模式下，你编辑的是 Ubuntu 文件系统上的代码 (`/home/user/project`)，但在终端调用 Docker 命令。
|
||||
|
||||
1. **连接成功后**，点击 "Open Folder"。
|
||||
|
||||
2. 选择 Ubuntu 上 `docker-compose.yml` 或项目代码所在的路径。
|
||||
|
||||
3. 打开终端 (`Ctrl + ~`)，直接执行 `docker compose up -d` 等命令。
|
||||
|
||||
4. **优点**：适合管理 `docker-compose.yml` 文件本身，或者同时管理多个微服务容器的配置。
|
||||
|
||||
|
||||
---
|
||||
|
||||
#### 第四阶段：解决常见“坑” (Troubleshooting)
|
||||
|
||||
根据经验，在内网开发 Docker 项目常遇到以下问题，请提前规避：
|
||||
|
||||
1. **Git 凭证问题**：
|
||||
|
||||
- 如果在容器内开发（模式 A），容器内可能没有你的 SSH Key 或 Git 配置。
|
||||
|
||||
- **解决**：Trae/VS Code 通常会自动转发本地的 SSH Agent。确保本地运行了 SSH Agent (`eval "$(ssh-agent -s)" && ssh-add`)，这样容器内拉取代码使用的是你本地的 Key。
|
||||
|
||||
2. **文件权限 (UID/GID) 问题**：
|
||||
|
||||
- 如果使用 Volume 挂载（将 Ubuntu 目录挂载进容器），容器内生成的 Build 文件可能归属于 `root`，导致你在宿主机无法删除或修改。
|
||||
|
||||
- **解决**：在 Dockerfile 中创建与宿主机相同 UID 的用户，或在 `docker-compose.yml` 中指定 `user: "${UID}:${GID}"`。
|
||||
|
||||
3. **内网穿透 (如果不只是局域网)**：
|
||||
|
||||
- 如果你离开办公地点，需要从公网访问这个内网 Server。
|
||||
|
||||
- **建议**：不要直接暴露 SSH 端口。在 Ubuntu 上安装 **Tailscale** 或 **Cloudflare Tunnel**。
|
||||
|
||||
- 如果使用 Tailscale，Trae 的 SSH Config HostName 可以直接填 Tailscale 的 IP (如 `100.x.x.x`)，实现无缝切换。
|
||||
@@ -1,301 +1,301 @@
|
||||
#ubuntu #vibe-kanban #vibe-coding #npm #npx #pm2
|
||||
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
**Ubuntu Server 下安装、管理 Vibe-Kanban + OpenCode 的完整文档**，以 `shenwei` 用户操作、使用 Node 20 和 pm2 管理进程，包含详细命令和验证步骤。
|
||||
|
||||
以下是完整 Markdown 文档：
|
||||
|
||||
---
|
||||
---
|
||||
title: Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
author: shenwei
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
---
|
||||
title: Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
# Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
|
||||
本文档详细说明了如何在 Ubuntu Server 上使用非 root 用户（`shenwei`）安装 Node 20、Vibe-Kanban 与 OpenCode，并通过 pm2 管理进程，同时提供完整的验证步骤。
|
||||
|
||||
---
|
||||
|
||||
## 1️⃣ 清理旧的安装
|
||||
|
||||
**目的**：清理之前安装的 Node、Vibe-Kanban、OpenCode、工作树等，避免权限冲突和端口占用。
|
||||
|
||||
### 步骤：
|
||||
|
||||
1. 停止所有旧进程
|
||||
|
||||
|
||||
```bash
|
||||
# 查看旧的 vibe-kanban 或 opencode 进程
|
||||
ps aux | grep -E 'vibe-kanban|opencode' | grep -v grep
|
||||
|
||||
# 停掉进程
|
||||
kill <PID>
|
||||
```
|
||||
|
||||
2. 删除旧工作树与缓存
|
||||
|
||||
|
||||
```bash
|
||||
rm -rf /var/tmp/vibe-kanban/worktrees/*
|
||||
rm -rf ~/.vibe-kanban
|
||||
```
|
||||
|
||||
3. 确保用户 `shenwei` 对目录有读写权限
|
||||
|
||||
|
||||
```bash
|
||||
sudo chown -R shenwei:shenwei /var/tmp/vibe-kanban
|
||||
sudo chown -R shenwei:shenwei ~/.vibe-kanban
|
||||
```
|
||||
|
||||
4. 如果之前系统安装了旧 Node 或全局 npm 包，可选择卸载
|
||||
|
||||
|
||||
```bash
|
||||
sudo apt remove nodejs npm -y
|
||||
sudo rm -rf /usr/local/lib/node_modules
|
||||
sudo rm -f /usr/local/bin/node /usr/local/bin/npm
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 2️⃣ 安装 Node 20（使用 nvm）
|
||||
|
||||
**目的**：确保 Node 版本为 20，兼容最新 Vibe-Kanban 和 OpenCode。
|
||||
|
||||
### 安装 nvm
|
||||
|
||||
```bash
|
||||
# 下载并安装 nvm（代理环境下可用 proxychains）
|
||||
curl -fsSL https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
|
||||
|
||||
# 添加环境变量到 shenwei 的 bash 配置
|
||||
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.bashrc
|
||||
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc
|
||||
|
||||
# 重新加载 bash
|
||||
source ~/.bashrc
|
||||
```
|
||||
|
||||
### 安装 Node 20
|
||||
|
||||
```bash
|
||||
nvm install 20
|
||||
nvm use 20
|
||||
nvm alias default 20
|
||||
|
||||
# 验证 Node 和 npm
|
||||
node -v # 应该显示 v20.x.x
|
||||
npm -v
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3️⃣ 安装 Vibe-Kanban 与 OpenCode（用户 `shenwei`）
|
||||
|
||||
### 安装 Vibe-Kanban
|
||||
|
||||
```bash
|
||||
# 安装最新版本
|
||||
npm install -g vibe-kanban
|
||||
|
||||
# 创建工作目录
|
||||
mkdir -p ~/vibe-kanban-projects
|
||||
cd ~/vibe-kanban-projects
|
||||
```
|
||||
|
||||
### 安装 OpenCode
|
||||
|
||||
```bash
|
||||
# 安装 OpenCode CLI
|
||||
npm install -g opencode-ai
|
||||
|
||||
# 验证安装
|
||||
opencode --version
|
||||
```
|
||||
|
||||
> ⚠️ 注意：不要用 root 启动 OpenCode serve，vibe-kanban 会自动 spawn executor
|
||||
|
||||
---
|
||||
|
||||
## 4️⃣ 查看安装后的进程和验证
|
||||
|
||||
### 查看进程
|
||||
|
||||
```bash
|
||||
# 查看 Node 相关进程
|
||||
ps aux | grep -E 'vibe-kanban|opencode' | grep -v grep
|
||||
|
||||
# 查看监听端口
|
||||
ss -lntp | grep opencode
|
||||
ss -lntp | grep vibe-kanban
|
||||
```
|
||||
|
||||
### 参考用pm2启动进程
|
||||
### 验证 vibe-kanban 启动
|
||||
|
||||
```bash
|
||||
# 使用 debug 模式启动
|
||||
RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban
|
||||
```
|
||||
|
||||
- 日志中应包含：
|
||||
|
||||
|
||||
```
|
||||
Server running on http://0.0.0.0:9999
|
||||
Starting executor on port <random_port>
|
||||
```
|
||||
|
||||
- 如果浏览器无法自动打开，可手动访问：[http://192.168.3.45:9999](http://192.168.3.45:9999/)
|
||||
|
||||
|
||||
### 验证 OpenCode executor
|
||||
|
||||
- vibe-kanban 启动后会 spawn executor（随机端口），可通过日志查看端口
|
||||
|
||||
- 检查端口是否在监听：
|
||||
|
||||
|
||||
```bash
|
||||
ss -lntp | grep opencode
|
||||
```
|
||||
|
||||
- 用 curl 测试 executor 健康（假设端口 40829）：
|
||||
|
||||
|
||||
```bash
|
||||
curl http://127.0.0.1:40829/health
|
||||
# 返回 OK
|
||||
```
|
||||
|
||||
> ⚠️ 遇到 I/O error 时，通常是 executor 没启动或端口被占用
|
||||
|
||||
---
|
||||
|
||||
## 5️⃣ 使用 pm2 管理进程
|
||||
|
||||
### 安装 pm2
|
||||
|
||||
```bash
|
||||
npm install -g pm2
|
||||
```
|
||||
|
||||
### 使用 pm2 启动 Vibe-Kanban
|
||||
|
||||
```bash
|
||||
pm2 start "RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
|
||||
# 查看状态
|
||||
pm2 status
|
||||
|
||||
# 查看日志
|
||||
pm2 logs vibe-kanban
|
||||
```
|
||||
|
||||
### 使用 pm2 启动 OpenCode Executor
|
||||
``` bash
|
||||
pm2 start "opencode serve --hostname 127.0.0.1 --port 40829" --name opencode-executor
|
||||
|
||||
# 查看状态
|
||||
pm2 status
|
||||
|
||||
# 查看日志
|
||||
pm2 logs opencode-executor
|
||||
```
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 6️⃣ 完整验证步骤
|
||||
|
||||
1. 清理旧工作树和进程
|
||||
|
||||
2. 确认 Node 20 已正确安装
|
||||
|
||||
3. 确认 Vibe-Kanban 与 OpenCode 已安装并属于 `shenwei` 用户
|
||||
|
||||
4. 启动 vibe-kanban：
|
||||
|
||||
|
||||
```bash
|
||||
RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban
|
||||
```
|
||||
|
||||
5. 检查日志：
|
||||
|
||||
|
||||
```
|
||||
Server running on http://0.0.0.0:9999
|
||||
Starting executor on port <random_port>
|
||||
```
|
||||
|
||||
6. 检查监听端口：
|
||||
|
||||
|
||||
```bash
|
||||
ss -lntp | grep node
|
||||
```
|
||||
|
||||
7. 用浏览器或 curl 访问：
|
||||
|
||||
|
||||
```
|
||||
http://127.0.0.1:9999
|
||||
curl http://127.0.0.1:<executor_port>/health
|
||||
```
|
||||
|
||||
8. pm2 管理进程：
|
||||
|
||||
|
||||
```bash
|
||||
pm2 start "RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
pm2 logs vibe-kanban
|
||||
pm2 save
|
||||
pm2 startup systemd -u shenwei --hp /home/shenwei
|
||||
```
|
||||
|
||||
9. 完整测试：
|
||||
|
||||
|
||||
- 创建测试项目
|
||||
|
||||
- 创建任务
|
||||
|
||||
- 日志中不应再出现：
|
||||
|
||||
|
||||
```
|
||||
OpenCode executor error: I/O error: error sending request ...
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### ✅ 总结
|
||||
|
||||
- **不要用 root** 启动 OpenCode serve
|
||||
|
||||
- **vibe-kanban 自行 spawn executor**，随机端口即可
|
||||
|
||||
- pm2 只管理 **vibe-kanban**，executor 随进程一起管理
|
||||
|
||||
- 保证 `/var/tmp/vibe-kanban` 和 `~/.vibe-kanban` 权限属于用户
|
||||
|
||||
- Node 版本 20 + npm 最新即可
|
||||
#ubuntu #vibe-kanban #vibe-coding #npm #npx #pm2
|
||||
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
**Ubuntu Server 下安装、管理 Vibe-Kanban + OpenCode 的完整文档**，以 `shenwei` 用户操作、使用 Node 20 和 pm2 管理进程，包含详细命令和验证步骤。
|
||||
|
||||
以下是完整 Markdown 文档：
|
||||
|
||||
---
|
||||
---
|
||||
title: Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
author: shenwei
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
---
|
||||
title: Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
# Vibe-Kanban + OpenCode 在 Ubuntu Server 上安装与管理指南
|
||||
|
||||
本文档详细说明了如何在 Ubuntu Server 上使用非 root 用户（`shenwei`）安装 Node 20、Vibe-Kanban 与 OpenCode，并通过 pm2 管理进程，同时提供完整的验证步骤。
|
||||
|
||||
---
|
||||
|
||||
## 1️⃣ 清理旧的安装
|
||||
|
||||
**目的**：清理之前安装的 Node、Vibe-Kanban、OpenCode、工作树等，避免权限冲突和端口占用。
|
||||
|
||||
### 步骤：
|
||||
|
||||
1. 停止所有旧进程
|
||||
|
||||
|
||||
```bash
|
||||
# 查看旧的 vibe-kanban 或 opencode 进程
|
||||
ps aux | grep -E 'vibe-kanban|opencode' | grep -v grep
|
||||
|
||||
# 停掉进程
|
||||
kill <PID>
|
||||
```
|
||||
|
||||
2. 删除旧工作树与缓存
|
||||
|
||||
|
||||
```bash
|
||||
rm -rf /var/tmp/vibe-kanban/worktrees/*
|
||||
rm -rf ~/.vibe-kanban
|
||||
```
|
||||
|
||||
3. 确保用户 `shenwei` 对目录有读写权限
|
||||
|
||||
|
||||
```bash
|
||||
sudo chown -R shenwei:shenwei /var/tmp/vibe-kanban
|
||||
sudo chown -R shenwei:shenwei ~/.vibe-kanban
|
||||
```
|
||||
|
||||
4. 如果之前系统安装了旧 Node 或全局 npm 包，可选择卸载
|
||||
|
||||
|
||||
```bash
|
||||
sudo apt remove nodejs npm -y
|
||||
sudo rm -rf /usr/local/lib/node_modules
|
||||
sudo rm -f /usr/local/bin/node /usr/local/bin/npm
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 2️⃣ 安装 Node 20（使用 nvm）
|
||||
|
||||
**目的**：确保 Node 版本为 20，兼容最新 Vibe-Kanban 和 OpenCode。
|
||||
|
||||
### 安装 nvm
|
||||
|
||||
```bash
|
||||
# 下载并安装 nvm（代理环境下可用 proxychains）
|
||||
curl -fsSL https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
|
||||
|
||||
# 添加环境变量到 shenwei 的 bash 配置
|
||||
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.bashrc
|
||||
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc
|
||||
|
||||
# 重新加载 bash
|
||||
source ~/.bashrc
|
||||
```
|
||||
|
||||
### 安装 Node 20
|
||||
|
||||
```bash
|
||||
nvm install 20
|
||||
nvm use 20
|
||||
nvm alias default 20
|
||||
|
||||
# 验证 Node 和 npm
|
||||
node -v # 应该显示 v20.x.x
|
||||
npm -v
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3️⃣ 安装 Vibe-Kanban 与 OpenCode（用户 `shenwei`）
|
||||
|
||||
### 安装 Vibe-Kanban
|
||||
|
||||
```bash
|
||||
# 安装最新版本
|
||||
npm install -g vibe-kanban
|
||||
|
||||
# 创建工作目录
|
||||
mkdir -p ~/vibe-kanban-projects
|
||||
cd ~/vibe-kanban-projects
|
||||
```
|
||||
|
||||
### 安装 OpenCode
|
||||
|
||||
```bash
|
||||
# 安装 OpenCode CLI
|
||||
npm install -g opencode-ai
|
||||
|
||||
# 验证安装
|
||||
opencode --version
|
||||
```
|
||||
|
||||
> ⚠️ 注意：不要用 root 启动 OpenCode serve，vibe-kanban 会自动 spawn executor
|
||||
|
||||
---
|
||||
|
||||
## 4️⃣ 查看安装后的进程和验证
|
||||
|
||||
### 查看进程
|
||||
|
||||
```bash
|
||||
# 查看 Node 相关进程
|
||||
ps aux | grep -E 'vibe-kanban|opencode' | grep -v grep
|
||||
|
||||
# 查看监听端口
|
||||
ss -lntp | grep opencode
|
||||
ss -lntp | grep vibe-kanban
|
||||
```
|
||||
|
||||
### 参考用pm2启动进程
|
||||
### 验证 vibe-kanban 启动
|
||||
|
||||
```bash
|
||||
# 使用 debug 模式启动
|
||||
RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban
|
||||
```
|
||||
|
||||
- 日志中应包含：
|
||||
|
||||
|
||||
```
|
||||
Server running on http://0.0.0.0:9999
|
||||
Starting executor on port <random_port>
|
||||
```
|
||||
|
||||
- 如果浏览器无法自动打开，可手动访问：[http://192.168.3.45:9999](http://192.168.3.45:9999/)
|
||||
|
||||
|
||||
### 验证 OpenCode executor
|
||||
|
||||
- vibe-kanban 启动后会 spawn executor（随机端口），可通过日志查看端口
|
||||
|
||||
- 检查端口是否在监听：
|
||||
|
||||
|
||||
```bash
|
||||
ss -lntp | grep opencode
|
||||
```
|
||||
|
||||
- 用 curl 测试 executor 健康（假设端口 40829）：
|
||||
|
||||
|
||||
```bash
|
||||
curl http://127.0.0.1:40829/health
|
||||
# 返回 OK
|
||||
```
|
||||
|
||||
> ⚠️ 遇到 I/O error 时，通常是 executor 没启动或端口被占用
|
||||
|
||||
---
|
||||
|
||||
## 5️⃣ 使用 pm2 管理进程
|
||||
|
||||
### 安装 pm2
|
||||
|
||||
```bash
|
||||
npm install -g pm2
|
||||
```
|
||||
|
||||
### 使用 pm2 启动 Vibe-Kanban
|
||||
|
||||
```bash
|
||||
pm2 start "RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
|
||||
# 查看状态
|
||||
pm2 status
|
||||
|
||||
# 查看日志
|
||||
pm2 logs vibe-kanban
|
||||
```
|
||||
|
||||
### 使用 pm2 启动 OpenCode Executor
|
||||
``` bash
|
||||
pm2 start "opencode serve --hostname 127.0.0.1 --port 40829" --name opencode-executor
|
||||
|
||||
# 查看状态
|
||||
pm2 status
|
||||
|
||||
# 查看日志
|
||||
pm2 logs opencode-executor
|
||||
```
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 6️⃣ 完整验证步骤
|
||||
|
||||
1. 清理旧工作树和进程
|
||||
|
||||
2. 确认 Node 20 已正确安装
|
||||
|
||||
3. 确认 Vibe-Kanban 与 OpenCode 已安装并属于 `shenwei` 用户
|
||||
|
||||
4. 启动 vibe-kanban：
|
||||
|
||||
|
||||
```bash
|
||||
RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban
|
||||
```
|
||||
|
||||
5. 检查日志：
|
||||
|
||||
|
||||
```
|
||||
Server running on http://0.0.0.0:9999
|
||||
Starting executor on port <random_port>
|
||||
```
|
||||
|
||||
6. 检查监听端口：
|
||||
|
||||
|
||||
```bash
|
||||
ss -lntp | grep node
|
||||
```
|
||||
|
||||
7. 用浏览器或 curl 访问：
|
||||
|
||||
|
||||
```
|
||||
http://127.0.0.1:9999
|
||||
curl http://127.0.0.1:<executor_port>/health
|
||||
```
|
||||
|
||||
8. pm2 管理进程：
|
||||
|
||||
|
||||
```bash
|
||||
pm2 start "RUST_LOG=debug HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
pm2 logs vibe-kanban
|
||||
pm2 save
|
||||
pm2 startup systemd -u shenwei --hp /home/shenwei
|
||||
```
|
||||
|
||||
9. 完整测试：
|
||||
|
||||
|
||||
- 创建测试项目
|
||||
|
||||
- 创建任务
|
||||
|
||||
- 日志中不应再出现：
|
||||
|
||||
|
||||
```
|
||||
OpenCode executor error: I/O error: error sending request ...
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### ✅ 总结
|
||||
|
||||
- **不要用 root** 启动 OpenCode serve
|
||||
|
||||
- **vibe-kanban 自行 spawn executor**，随机端口即可
|
||||
|
||||
- pm2 只管理 **vibe-kanban**，executor 随进程一起管理
|
||||
|
||||
- 保证 `/var/tmp/vibe-kanban` 和 `~/.vibe-kanban` 权限属于用户
|
||||
|
||||
- Node 版本 20 + npm 最新即可
|
||||
|
||||
@@ -1,71 +1,71 @@
|
||||
---
|
||||
title: vibe-coding-cn/i18n/zh/documents/Methodology and Principles/A Formalization of Recursive Self-Optimizing Generative Systems.md at main · 2025Emma/vibe-coding-cn
|
||||
source: https://github.com/2025Emma/vibe-coding-cn/blob/main/i18n/zh/documents/Methodology%20and%20Principles/vibe-coding-%E7%BB%8F%E9%AA%8C%E6%94%B6%E9%9B%86.md
|
||||
author: shenwei
|
||||
published:
|
||||
created: 2025-12-30
|
||||
description: Contribute to 2025Emma/vibe-coding-cn development by creating an account on GitHub.
|
||||
tags: []
|
||||
---
|
||||
|
||||
|
||||
|
||||
[https://x.com/3i8ae3pgjz56244/status/1993328642697707736?s=46](https://x.com/3i8ae3pgjz56244/status/1993328642697707736?s=46)
|
||||
|
||||
我是把设计文档写得很细，包括service层的具体逻辑都用伪代码写了，然后交给AI，一遍直出，再用另一个AI review一遍，根据review意见修改一下，跑一下测试用例，让AI自己生成commit后push
|
||||
|
||||
点评：需求 -> 伪代码 -> 代码
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/jesselaunz/status/1993231396035301437?s=20](https://x.com/jesselaunz/status/1993231396035301437?s=20)
|
||||
|
||||
针对gemini 3 pro的系统prompt，使多个代理基准测试的性能提高了约 5%。
|
||||
|
||||
---
|
||||
|
||||
点 -> 线 -> 体 的逐级迭代，对应使用范围内的任务，先打磨好单个基础任务，然后基于此进行批量执行
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/nake13/status/1995123181057917032?s=46](https://x.com/nake13/status/1995123181057917032?s=46)
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/9hills/status/1995308023578042844?s=46](https://x.com/9hills/status/1995308023578042844?s=46)
|
||||
|
||||
---
|
||||
|
||||
文件头注释，一段话描述代码作用，上下游链路，文档维护agents或者claude维护每个模块的一段话说明，降低认知负载，尽量做减法和索引，参考claude skill
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/dogejustdoit/status/1996464777313542204?s=46](https://x.com/dogejustdoit/status/1996464777313542204?s=46)
|
||||
|
||||
随着软件规模不断扩大，靠人眼去“看代码”不仅无法应对增长的复杂度，还会让开发者疲于奔命。代码最终会被转换成机器码执行，高级语言只是一层方便人类理解的抽象，重要的是验证程序的执行逻辑，通过自动化测试、静态分析、形式化验证等手段确保行为正确。未来的软件工程核心不是“看懂代码”，而是“验证代码按正确逻辑运行”
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/yanboofficial/status/1996188311451480538?s=46](https://x.com/yanboofficial/status/1996188311451480538?s=46)
|
||||
|
||||
```
|
||||
请你根据我的要求，用 Three.js 创建一个实时交互的3D粒子系统，如果你第一次就做得好，我将会打赏你100美元的小费;我的要求是：
|
||||
```
|
||||
|
||||
点评：这个提示词可能会提升生成的效果
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/zen\_of\_nemesis/status/1996591768641458368?s=46](https://x.com/zen_of_nemesis/status/1996591768641458368?s=46)
|
||||
|
||||
---
|
||||
|
||||
[https://github.com/tesserato/CodeWeaver](https://github.com/tesserato/CodeWeaver)
|
||||
|
||||
CodeWeaver 将你的代码库编织成一个可导航的 Markdown 文档
|
||||
|
||||
它能把你整个项目，不管有多少屎山代码，直接“编织”成一个条理清晰的 Markdown 文件，结构是树形的，一目了然。所有代码都给你塞进代码块里，极大地简化了代码库的共享、文档化以及与 AI/ML 工具集成
|
||||
|
||||
---
|
||||
|
||||
---
|
||||
title: vibe-coding-cn/i18n/zh/documents/Methodology and Principles/A Formalization of Recursive Self-Optimizing Generative Systems.md at main · 2025Emma/vibe-coding-cn
|
||||
source: https://github.com/2025Emma/vibe-coding-cn/blob/main/i18n/zh/documents/Methodology%20and%20Principles/vibe-coding-%E7%BB%8F%E9%AA%8C%E6%94%B6%E9%9B%86.md
|
||||
author: shenwei
|
||||
published:
|
||||
created: 2025-12-30
|
||||
description: Contribute to 2025Emma/vibe-coding-cn development by creating an account on GitHub.
|
||||
tags: []
|
||||
---
|
||||
|
||||
|
||||
|
||||
[https://x.com/3i8ae3pgjz56244/status/1993328642697707736?s=46](https://x.com/3i8ae3pgjz56244/status/1993328642697707736?s=46)
|
||||
|
||||
我是把设计文档写得很细，包括service层的具体逻辑都用伪代码写了，然后交给AI，一遍直出，再用另一个AI review一遍，根据review意见修改一下，跑一下测试用例，让AI自己生成commit后push
|
||||
|
||||
点评：需求 -> 伪代码 -> 代码
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/jesselaunz/status/1993231396035301437?s=20](https://x.com/jesselaunz/status/1993231396035301437?s=20)
|
||||
|
||||
针对gemini 3 pro的系统prompt，使多个代理基准测试的性能提高了约 5%。
|
||||
|
||||
---
|
||||
|
||||
点 -> 线 -> 体 的逐级迭代，对应使用范围内的任务，先打磨好单个基础任务，然后基于此进行批量执行
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/nake13/status/1995123181057917032?s=46](https://x.com/nake13/status/1995123181057917032?s=46)
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/9hills/status/1995308023578042844?s=46](https://x.com/9hills/status/1995308023578042844?s=46)
|
||||
|
||||
---
|
||||
|
||||
文件头注释，一段话描述代码作用，上下游链路，文档维护agents或者claude维护每个模块的一段话说明，降低认知负载，尽量做减法和索引，参考claude skill
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/dogejustdoit/status/1996464777313542204?s=46](https://x.com/dogejustdoit/status/1996464777313542204?s=46)
|
||||
|
||||
随着软件规模不断扩大，靠人眼去“看代码”不仅无法应对增长的复杂度，还会让开发者疲于奔命。代码最终会被转换成机器码执行，高级语言只是一层方便人类理解的抽象，重要的是验证程序的执行逻辑，通过自动化测试、静态分析、形式化验证等手段确保行为正确。未来的软件工程核心不是“看懂代码”，而是“验证代码按正确逻辑运行”
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/yanboofficial/status/1996188311451480538?s=46](https://x.com/yanboofficial/status/1996188311451480538?s=46)
|
||||
|
||||
```
|
||||
请你根据我的要求，用 Three.js 创建一个实时交互的3D粒子系统，如果你第一次就做得好，我将会打赏你100美元的小费;我的要求是：
|
||||
```
|
||||
|
||||
点评：这个提示词可能会提升生成的效果
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/zen\_of\_nemesis/status/1996591768641458368?s=46](https://x.com/zen_of_nemesis/status/1996591768641458368?s=46)
|
||||
|
||||
---
|
||||
|
||||
[https://github.com/tesserato/CodeWeaver](https://github.com/tesserato/CodeWeaver)
|
||||
|
||||
CodeWeaver 将你的代码库编织成一个可导航的 Markdown 文档
|
||||
|
||||
它能把你整个项目，不管有多少屎山代码，直接“编织”成一个条理清晰的 Markdown 文件，结构是树形的，一目了然。所有代码都给你塞进代码块里，极大地简化了代码库的共享、文档化以及与 AI/ML 工具集成
|
||||
|
||||
---
|
||||
|
||||
[https://x.com/magic47972451/status/1998639692905087356?s=46](https://x.com/magic47972451/status/1998639692905087356?s=46)
|
||||
@@ -1,159 +1,159 @@
|
||||
---
|
||||
title: 在Ubuntu 上安装Vibe-Kanban
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
#ubuntu #vibe-kanban #vibe-coding #npm #npx #pm2
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
# 在Ubuntu 上安装Vibe-Kanban
|
||||
|
||||
## Git 项目
|
||||
https://github.com/BloopAI/vibe-kanban
|
||||
|
||||
https://www.vibekanban.com/docs/getting-started
|
||||
## Prerequisites
|
||||
|
||||
Before installing Vibe Kanban, ensure you have:
|
||||
|
||||
- **Node.js**: Latest LTS version recommended
|
||||
- **Coding agent authentication**: Authenticate with your preferred coding agents outside of Vibe Kanban
|
||||
|
||||
## Safety Notice
|
||||
|
||||
Vibe Kanban runs AI agents with —dangerously-skip-permissions/—yolo flags by default so they can work autonomously without constant approval prompts. Each task runs in an isolated git worktree, preventing agents from interfering with each other. Agents can still perform system-level actions, so review their work and keep backups.
|
||||
|
||||
## Installation & Setup
|
||||
|
||||
### 1 Authenticate with a coding agent
|
||||
|
||||
Before launching Vibe Kanban, ensure you’re authenticated with at least one [supported coding agent](https://www.vibekanban.com/docs/supported-coding-agents). Follow the installation and authentication instructions for your preferred agent.
|
||||
|
||||
### 2 Install and launch Vibe Kanban
|
||||
|
||||
Open a terminal and run:
|
||||
|
||||
```
|
||||
npx vibe-kanban
|
||||
```
|
||||
|
||||
The application will bind to a random free port, print the URL in the terminal, and automatically open in your default browser.
|
||||
|
||||
### 3 Complete initial setup
|
||||
|
||||
Complete the setup dialogs to configure your coding agent and editor preferences. GitHub integration relies on the GitHub CLI and is configured when needed.
|
||||
|
||||
### 4 Create your first project
|
||||
|
||||
You’ll land on the Projects page, populated with your three most recently active git projects if automatically discovered. Click “Create project” to add more projects.
|
||||
|
||||
### 5 Add tasks
|
||||
|
||||
Start tracking your work by [creating tasks](https://www.vibekanban.com/docs/core-features/creating-tasks) within your project.
|
||||
|
||||
### 6 Optional: GitHub integration
|
||||
|
||||
Vibe Kanban uses the [GitHub CLI](https://cli.github.com/) for creating pull requests. Ensure `gh` is installed and authenticated on your system, or follow the setup prompts when creating your first pull request.
|
||||
|
||||
### 7 Optional: Set up MCP integration
|
||||
|
||||
Streamline task creation with coding agents by [setting up MCP integration](https://www.vibekanban.com/docs/integrations/vibe-kanban-mcp-server).
|
||||
|
||||
To use a fixed port, specify the `PORT` environment variable: `PORT=8080 npx vibe-kanban`
|
||||
|
||||
|
||||
## 使用 PM2来管理Vibe-Kanban 进程
|
||||
|
||||
PM2 是一个进程管理器，非常适合管理像 `vibe-kanban` 这种基于 Node.js 的工具。它可以自动重启、开机自启，并提供简单的管理界面。
|
||||
|
||||
**1. 安装 PM2：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
sudo npm install -g pm2
|
||||
```
|
||||
|
||||
**2. 后台启动 vibe-kanban：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
# 注意这里需要用引号把启动命令包起来
|
||||
pm2 start "HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
```
|
||||
|
||||
```
|
||||
shenwei@shenwei-ubuntu-2:~$ pm2 start "HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
|
||||
-------------
|
||||
|
||||
__/\\\\\\\\\\\\\____/\\\\____________/\\\\____/\\\\\\\\\_____
|
||||
_\/\\\/////////\\\_\/\\\\\\________/\\\\\\__/\\\///////\\\___
|
||||
_\/\\\_______\/\\\_\/\\\//\\\____/\\\//\\\_\///______\//\\\__
|
||||
_\/\\\\\\\\\\\\\/__\/\\\\///\\\/\\\/_\/\\\___________/\\\/___
|
||||
_\/\\\/////////____\/\\\__\///\\\/___\/\\\________/\\\//_____
|
||||
_\/\\\_____________\/\\\____\///_____\/\\\_____/\\\//________
|
||||
_\/\\\_____________\/\\\_____________\/\\\___/\\\/___________
|
||||
_\/\\\_____________\/\\\_____________\/\\\__/\\\\\\\\\\\\\\\_
|
||||
_\///______________\///______________\///__\///////////////__
|
||||
|
||||
|
||||
Runtime Edition
|
||||
|
||||
PM2 is a Production Process Manager for Node.js applications
|
||||
with a built-in Load Balancer.
|
||||
|
||||
Start and Daemonize any application:
|
||||
$ pm2 start app.js
|
||||
|
||||
Load Balance 4 instances of api.js:
|
||||
$ pm2 start api.js -i 4
|
||||
|
||||
Monitor in production:
|
||||
$ pm2 monitor
|
||||
|
||||
Make pm2 auto-boot at server restart:
|
||||
$ pm2 startup
|
||||
|
||||
To go further checkout:
|
||||
http://pm2.io/
|
||||
|
||||
|
||||
-------------
|
||||
|
||||
[PM2] Spawning PM2 daemon with pm2_home=/home/shenwei/.pm2
|
||||
[PM2] PM2 Successfully daemonized
|
||||
[PM2] Starting /usr/bin/bash in fork_mode (1 instance)
|
||||
[PM2] Done.
|
||||
┌────┬────────────────┬─────────────┬─────────┬─────────┬──────────┬────────┬──────┬───────────┬──────────┬──────────┬──────────┬──────────┐
|
||||
│ id │ name │ namespace │ version │ mode │ pid │ uptime │ ↺ │ status │ cpu │ mem │ user │ watching │
|
||||
├────┼────────────────┼─────────────┼─────────┼─────────┼──────────┼────────┼──────┼───────────┼──────────┼──────────┼──────────┼──────────┤
|
||||
│ 0 │ vibe-kanban │ default │ N/A │ fork │ 2232962 │ 0s │ 0 │ online │ 0% │ 13.9mb │ shenwei │ disabled │
|
||||
└────┴────────────────┴─────────────┴─────────┴─────────┴──────────┴────────┴──────┴───────────┴──────────┴──────────┴──────────┴──────────┘
|
||||
|
||||
```
|
||||
|
||||
|
||||
**3. 如何管理：**
|
||||
|
||||
- **查看状态**：`pm2 list`
|
||||
|
||||
- **查看实时日志**：`pm2 logs vibe-kanban`
|
||||
|
||||
- **手动停止**：`pm2 stop vibe-kanban`
|
||||
|
||||
- **重启**：`pm2 restart vibe-kanban`
|
||||
|
||||
- **彻底删除进程记录**：`pm2 delete vibe-kanban`
|
||||
|
||||
|
||||
**4. 打开vibe-kanban：**
|
||||
---
|
||||
title: 在Ubuntu 上安装Vibe-Kanban
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [npm, npx, pm2, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
#ubuntu #vibe-kanban #vibe-coding #npm #npx #pm2
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
# 在Ubuntu 上安装Vibe-Kanban
|
||||
|
||||
## Git 项目
|
||||
https://github.com/BloopAI/vibe-kanban
|
||||
|
||||
https://www.vibekanban.com/docs/getting-started
|
||||
## Prerequisites
|
||||
|
||||
Before installing Vibe Kanban, ensure you have:
|
||||
|
||||
- **Node.js**: Latest LTS version recommended
|
||||
- **Coding agent authentication**: Authenticate with your preferred coding agents outside of Vibe Kanban
|
||||
|
||||
## Safety Notice
|
||||
|
||||
Vibe Kanban runs AI agents with —dangerously-skip-permissions/—yolo flags by default so they can work autonomously without constant approval prompts. Each task runs in an isolated git worktree, preventing agents from interfering with each other. Agents can still perform system-level actions, so review their work and keep backups.
|
||||
|
||||
## Installation & Setup
|
||||
|
||||
### 1 Authenticate with a coding agent
|
||||
|
||||
Before launching Vibe Kanban, ensure you’re authenticated with at least one [supported coding agent](https://www.vibekanban.com/docs/supported-coding-agents). Follow the installation and authentication instructions for your preferred agent.
|
||||
|
||||
### 2 Install and launch Vibe Kanban
|
||||
|
||||
Open a terminal and run:
|
||||
|
||||
```
|
||||
npx vibe-kanban
|
||||
```
|
||||
|
||||
The application will bind to a random free port, print the URL in the terminal, and automatically open in your default browser.
|
||||
|
||||
### 3 Complete initial setup
|
||||
|
||||
Complete the setup dialogs to configure your coding agent and editor preferences. GitHub integration relies on the GitHub CLI and is configured when needed.
|
||||
|
||||
### 4 Create your first project
|
||||
|
||||
You’ll land on the Projects page, populated with your three most recently active git projects if automatically discovered. Click “Create project” to add more projects.
|
||||
|
||||
### 5 Add tasks
|
||||
|
||||
Start tracking your work by [creating tasks](https://www.vibekanban.com/docs/core-features/creating-tasks) within your project.
|
||||
|
||||
### 6 Optional: GitHub integration
|
||||
|
||||
Vibe Kanban uses the [GitHub CLI](https://cli.github.com/) for creating pull requests. Ensure `gh` is installed and authenticated on your system, or follow the setup prompts when creating your first pull request.
|
||||
|
||||
### 7 Optional: Set up MCP integration
|
||||
|
||||
Streamline task creation with coding agents by [setting up MCP integration](https://www.vibekanban.com/docs/integrations/vibe-kanban-mcp-server).
|
||||
|
||||
To use a fixed port, specify the `PORT` environment variable: `PORT=8080 npx vibe-kanban`
|
||||
|
||||
|
||||
## 使用 PM2来管理Vibe-Kanban 进程
|
||||
|
||||
PM2 是一个进程管理器，非常适合管理像 `vibe-kanban` 这种基于 Node.js 的工具。它可以自动重启、开机自启，并提供简单的管理界面。
|
||||
|
||||
**1. 安装 PM2：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
sudo npm install -g pm2
|
||||
```
|
||||
|
||||
**2. 后台启动 vibe-kanban：**
|
||||
|
||||
Bash
|
||||
|
||||
```
|
||||
# 注意这里需要用引号把启动命令包起来
|
||||
pm2 start "HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
```
|
||||
|
||||
```
|
||||
shenwei@shenwei-ubuntu-2:~$ pm2 start "HOST=0.0.0.0 PORT=9999 npx vibe-kanban" --name vibe-kanban
|
||||
|
||||
-------------
|
||||
|
||||
__/\\\\\\\\\\\\\____/\\\\____________/\\\\____/\\\\\\\\\_____
|
||||
_\/\\\/////////\\\_\/\\\\\\________/\\\\\\__/\\\///////\\\___
|
||||
_\/\\\_______\/\\\_\/\\\//\\\____/\\\//\\\_\///______\//\\\__
|
||||
_\/\\\\\\\\\\\\\/__\/\\\\///\\\/\\\/_\/\\\___________/\\\/___
|
||||
_\/\\\/////////____\/\\\__\///\\\/___\/\\\________/\\\//_____
|
||||
_\/\\\_____________\/\\\____\///_____\/\\\_____/\\\//________
|
||||
_\/\\\_____________\/\\\_____________\/\\\___/\\\/___________
|
||||
_\/\\\_____________\/\\\_____________\/\\\__/\\\\\\\\\\\\\\\_
|
||||
_\///______________\///______________\///__\///////////////__
|
||||
|
||||
|
||||
Runtime Edition
|
||||
|
||||
PM2 is a Production Process Manager for Node.js applications
|
||||
with a built-in Load Balancer.
|
||||
|
||||
Start and Daemonize any application:
|
||||
$ pm2 start app.js
|
||||
|
||||
Load Balance 4 instances of api.js:
|
||||
$ pm2 start api.js -i 4
|
||||
|
||||
Monitor in production:
|
||||
$ pm2 monitor
|
||||
|
||||
Make pm2 auto-boot at server restart:
|
||||
$ pm2 startup
|
||||
|
||||
To go further checkout:
|
||||
http://pm2.io/
|
||||
|
||||
|
||||
-------------
|
||||
|
||||
[PM2] Spawning PM2 daemon with pm2_home=/home/shenwei/.pm2
|
||||
[PM2] PM2 Successfully daemonized
|
||||
[PM2] Starting /usr/bin/bash in fork_mode (1 instance)
|
||||
[PM2] Done.
|
||||
┌────┬────────────────┬─────────────┬─────────┬─────────┬──────────┬────────┬──────┬───────────┬──────────┬──────────┬──────────┬──────────┐
|
||||
│ id │ name │ namespace │ version │ mode │ pid │ uptime │ ↺ │ status │ cpu │ mem │ user │ watching │
|
||||
├────┼────────────────┼─────────────┼─────────┼─────────┼──────────┼────────┼──────┼───────────┼──────────┼──────────┼──────────┼──────────┤
|
||||
│ 0 │ vibe-kanban │ default │ N/A │ fork │ 2232962 │ 0s │ 0 │ online │ 0% │ 13.9mb │ shenwei │ disabled │
|
||||
└────┴────────────────┴─────────────┴─────────┴─────────┴──────────┴────────┴──────┴───────────┴──────────┴──────────┴──────────┴──────────┘
|
||||
|
||||
```
|
||||
|
||||
|
||||
**3. 如何管理：**
|
||||
|
||||
- **查看状态**：`pm2 list`
|
||||
|
||||
- **查看实时日志**：`pm2 logs vibe-kanban`
|
||||
|
||||
- **手动停止**：`pm2 stop vibe-kanban`
|
||||
|
||||
- **重启**：`pm2 restart vibe-kanban`
|
||||
|
||||
- **彻底删除进程记录**：`pm2 delete vibe-kanban`
|
||||
|
||||
|
||||
**4. 打开vibe-kanban：**
|
||||
http://192.168.3.45:9999/
|
||||
@@ -1,239 +1,239 @@
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [opencode, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
|
||||
#opencode #ubuntu #vibe-coding #vibe-kanban
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Get started with OpenCode.
|
||||
|
||||
[**OpenCode**](https://opencode.ai/) is an open source AI coding agent. It’s available as a terminal-based interface, desktop app, or IDE extension.
|
||||
|
||||
## [Install](https://opencode.ai/docs#install)
|
||||
|
||||
The easiest way to install OpenCode is through the install script.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
curl -fsSL https://opencode.ai/install | bash
|
||||
```
|
||||
|
||||
## [Configure](https://opencode.ai/docs#configure)
|
||||
|
||||
With OpenCode you can use any LLM provider by configuring their API keys.
|
||||
|
||||
If you are new to using LLM providers, we recommend using [OpenCode Zen](https://opencode.ai/docs/zen). It’s a curated list of models that have been tested and verified by the OpenCode team.
|
||||
|
||||
1. Run the `/connect` command in the TUI, select opencode, and head to [opencode.ai/auth](https://opencode.ai/auth).
|
||||
|
||||
```
|
||||
/connect
|
||||
```
|
||||
|
||||
2. Sign in, add your billing details, and copy your API key.
|
||||
|
||||
3. Paste your API key.
|
||||
|
||||
```
|
||||
┌ API key││└ enter
|
||||
```
|
||||
|
||||
|
||||
Alternatively, you can select one of the other providers. [Learn more](https://opencode.ai/docs/providers#directory).
|
||||
|
||||
---
|
||||
|
||||
## [Initialize](https://opencode.ai/docs#initialize)
|
||||
|
||||
Now that you’ve configured a provider, you can navigate to a project that you want to work on.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
cd /path/to/project
|
||||
```
|
||||
|
||||
And run OpenCode.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
opencode
|
||||
```
|
||||
|
||||
Next, initialize OpenCode for the project by running the following command.
|
||||
|
||||
```
|
||||
/init
|
||||
```
|
||||
|
||||
This will get OpenCode to analyze your project and create an `AGENTS.md` file in the project root.
|
||||
|
||||
Tip
|
||||
|
||||
You should commit your project’s `AGENTS.md` file to Git.
|
||||
|
||||
This helps OpenCode understand the project structure and the coding patterns used.
|
||||
|
||||
---
|
||||
|
||||
## [Usage](https://opencode.ai/docs#usage)
|
||||
|
||||
You are now ready to use OpenCode to work on your project. Feel free to ask it anything!
|
||||
|
||||
If you are new to using an AI coding agent, here are some examples that might help.
|
||||
|
||||
---
|
||||
|
||||
### [Ask questions](https://opencode.ai/docs#ask-questions)
|
||||
|
||||
You can ask OpenCode to explain the codebase to you.
|
||||
|
||||
Tip
|
||||
|
||||
Use the `@` key to fuzzy search for files in the project.
|
||||
|
||||
```
|
||||
How is authentication handled in @packages/functions/src/api/index.ts
|
||||
```
|
||||
|
||||
This is helpful if there’s a part of the codebase that you didn’t work on.
|
||||
|
||||
---
|
||||
|
||||
### [Add features](https://opencode.ai/docs#add-features)
|
||||
|
||||
You can ask OpenCode to add new features to your project. Though we first recommend asking it to create a plan.
|
||||
|
||||
1. **Create a plan**
|
||||
|
||||
OpenCode has a _Plan mode_ that disables its ability to make changes and instead suggest _how_ it’ll implement the feature.
|
||||
|
||||
Switch to it using the **Tab** key. You’ll see an indicator for this in the lower right corner.
|
||||
|
||||
```
|
||||
<TAB>
|
||||
```
|
||||
|
||||
Now let’s describe what we want it to do.
|
||||
|
||||
```
|
||||
When a user deletes a note, we'd like to flag it as deleted in the database.Then create a screen that shows all the recently deleted notes.From this screen, the user can undelete a note or permanently delete it.
|
||||
```
|
||||
|
||||
You want to give OpenCode enough details to understand what you want. It helps to talk to it like you are talking to a junior developer on your team.
|
||||
|
||||
Tip
|
||||
|
||||
Give OpenCode plenty of context and examples to help it understand what you want.
|
||||
|
||||
2. **Iterate on the plan**
|
||||
|
||||
Once it gives you a plan, you can give it feedback or add more details.
|
||||
|
||||
```
|
||||
We'd like to design this new screen using a design I've used before.[Image #1] Take a look at this image and use it as a reference.
|
||||
```
|
||||
|
||||
Tip
|
||||
|
||||
Drag and drop images into the terminal to add them to the prompt.
|
||||
|
||||
OpenCode can scan any images you give it and add them to the prompt. You can do this by dragging and dropping an image into the terminal.
|
||||
|
||||
3. **Build the feature**
|
||||
|
||||
Once you feel comfortable with the plan, switch back to _Build mode_ by hitting the **Tab** key again.
|
||||
|
||||
```
|
||||
<TAB>
|
||||
```
|
||||
|
||||
And asking it to make the changes.
|
||||
|
||||
```
|
||||
Sounds good! Go ahead and make the changes.
|
||||
```
|
||||
|
||||
|
||||
---
|
||||
|
||||
### [Make changes](https://opencode.ai/docs#make-changes)
|
||||
|
||||
For more straightforward changes, you can ask OpenCode to directly build it without having to review the plan first.
|
||||
|
||||
```
|
||||
We need to add authentication to the /settings route. Take a look at how this ishandled in the /notes route in @packages/functions/src/notes.ts and implementthe same logic in @packages/functions/src/settings.ts
|
||||
```
|
||||
|
||||
You want to make sure you provide a good amount of detail so OpenCode makes the right changes.
|
||||
|
||||
---
|
||||
|
||||
### [Undo changes](https://opencode.ai/docs#undo-changes)
|
||||
|
||||
Let’s say you ask OpenCode to make some changes.
|
||||
|
||||
```
|
||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||
```
|
||||
|
||||
But you realize that it is not what you wanted. You **can undo** the changes using the `/undo` command.
|
||||
|
||||
```
|
||||
/undo
|
||||
```
|
||||
|
||||
OpenCode will now revert the changes you made and show your original message again.
|
||||
|
||||
```
|
||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||
```
|
||||
|
||||
From here you can tweak the prompt and ask OpenCode to try again.
|
||||
|
||||
Tip
|
||||
|
||||
You can run `/undo` multiple times to undo multiple changes.
|
||||
|
||||
Or you **can redo** the changes using the `/redo` command.
|
||||
|
||||
```
|
||||
/redo
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## [Share](https://opencode.ai/docs#share)
|
||||
|
||||
The conversations that you have with OpenCode can be [shared with your team](https://opencode.ai/docs/share).
|
||||
|
||||
```
|
||||
/share
|
||||
```
|
||||
|
||||
This will create a link to the current conversation and copy it to your clipboard.
|
||||
|
||||
Note
|
||||
|
||||
Conversations are not shared by default.
|
||||
|
||||
Here’s an [example conversation](https://opencode.ai/s/4XP1fce5) with OpenCode.
|
||||
|
||||
---
|
||||
|
||||
## [Customize](https://opencode.ai/docs#customize)
|
||||
|
||||
And that’s it! You are now a pro at using OpenCode.
|
||||
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [opencode, ubuntu, vibe-coding, vibe-kanban]
|
||||
---
|
||||
|
||||
|
||||
#opencode #ubuntu #vibe-coding #vibe-kanban
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Get started with OpenCode.
|
||||
|
||||
[**OpenCode**](https://opencode.ai/) is an open source AI coding agent. It’s available as a terminal-based interface, desktop app, or IDE extension.
|
||||
|
||||
## [Install](https://opencode.ai/docs#install)
|
||||
|
||||
The easiest way to install OpenCode is through the install script.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
curl -fsSL https://opencode.ai/install | bash
|
||||
```
|
||||
|
||||
## [Configure](https://opencode.ai/docs#configure)
|
||||
|
||||
With OpenCode you can use any LLM provider by configuring their API keys.
|
||||
|
||||
If you are new to using LLM providers, we recommend using [OpenCode Zen](https://opencode.ai/docs/zen). It’s a curated list of models that have been tested and verified by the OpenCode team.
|
||||
|
||||
1. Run the `/connect` command in the TUI, select opencode, and head to [opencode.ai/auth](https://opencode.ai/auth).
|
||||
|
||||
```
|
||||
/connect
|
||||
```
|
||||
|
||||
2. Sign in, add your billing details, and copy your API key.
|
||||
|
||||
3. Paste your API key.
|
||||
|
||||
```
|
||||
┌ API key││└ enter
|
||||
```
|
||||
|
||||
|
||||
Alternatively, you can select one of the other providers. [Learn more](https://opencode.ai/docs/providers#directory).
|
||||
|
||||
---
|
||||
|
||||
## [Initialize](https://opencode.ai/docs#initialize)
|
||||
|
||||
Now that you’ve configured a provider, you can navigate to a project that you want to work on.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
cd /path/to/project
|
||||
```
|
||||
|
||||
And run OpenCode.
|
||||
|
||||
Terminal window
|
||||
|
||||
```
|
||||
opencode
|
||||
```
|
||||
|
||||
Next, initialize OpenCode for the project by running the following command.
|
||||
|
||||
```
|
||||
/init
|
||||
```
|
||||
|
||||
This will get OpenCode to analyze your project and create an `AGENTS.md` file in the project root.
|
||||
|
||||
Tip
|
||||
|
||||
You should commit your project’s `AGENTS.md` file to Git.
|
||||
|
||||
This helps OpenCode understand the project structure and the coding patterns used.
|
||||
|
||||
---
|
||||
|
||||
## [Usage](https://opencode.ai/docs#usage)
|
||||
|
||||
You are now ready to use OpenCode to work on your project. Feel free to ask it anything!
|
||||
|
||||
If you are new to using an AI coding agent, here are some examples that might help.
|
||||
|
||||
---
|
||||
|
||||
### [Ask questions](https://opencode.ai/docs#ask-questions)
|
||||
|
||||
You can ask OpenCode to explain the codebase to you.
|
||||
|
||||
Tip
|
||||
|
||||
Use the `@` key to fuzzy search for files in the project.
|
||||
|
||||
```
|
||||
How is authentication handled in @packages/functions/src/api/index.ts
|
||||
```
|
||||
|
||||
This is helpful if there’s a part of the codebase that you didn’t work on.
|
||||
|
||||
---
|
||||
|
||||
### [Add features](https://opencode.ai/docs#add-features)
|
||||
|
||||
You can ask OpenCode to add new features to your project. Though we first recommend asking it to create a plan.
|
||||
|
||||
1. **Create a plan**
|
||||
|
||||
OpenCode has a _Plan mode_ that disables its ability to make changes and instead suggest _how_ it’ll implement the feature.
|
||||
|
||||
Switch to it using the **Tab** key. You’ll see an indicator for this in the lower right corner.
|
||||
|
||||
```
|
||||
<TAB>
|
||||
```
|
||||
|
||||
Now let’s describe what we want it to do.
|
||||
|
||||
```
|
||||
When a user deletes a note, we'd like to flag it as deleted in the database.Then create a screen that shows all the recently deleted notes.From this screen, the user can undelete a note or permanently delete it.
|
||||
```
|
||||
|
||||
You want to give OpenCode enough details to understand what you want. It helps to talk to it like you are talking to a junior developer on your team.
|
||||
|
||||
Tip
|
||||
|
||||
Give OpenCode plenty of context and examples to help it understand what you want.
|
||||
|
||||
2. **Iterate on the plan**
|
||||
|
||||
Once it gives you a plan, you can give it feedback or add more details.
|
||||
|
||||
```
|
||||
We'd like to design this new screen using a design I've used before.[Image #1] Take a look at this image and use it as a reference.
|
||||
```
|
||||
|
||||
Tip
|
||||
|
||||
Drag and drop images into the terminal to add them to the prompt.
|
||||
|
||||
OpenCode can scan any images you give it and add them to the prompt. You can do this by dragging and dropping an image into the terminal.
|
||||
|
||||
3. **Build the feature**
|
||||
|
||||
Once you feel comfortable with the plan, switch back to _Build mode_ by hitting the **Tab** key again.
|
||||
|
||||
```
|
||||
<TAB>
|
||||
```
|
||||
|
||||
And asking it to make the changes.
|
||||
|
||||
```
|
||||
Sounds good! Go ahead and make the changes.
|
||||
```
|
||||
|
||||
|
||||
---
|
||||
|
||||
### [Make changes](https://opencode.ai/docs#make-changes)
|
||||
|
||||
For more straightforward changes, you can ask OpenCode to directly build it without having to review the plan first.
|
||||
|
||||
```
|
||||
We need to add authentication to the /settings route. Take a look at how this ishandled in the /notes route in @packages/functions/src/notes.ts and implementthe same logic in @packages/functions/src/settings.ts
|
||||
```
|
||||
|
||||
You want to make sure you provide a good amount of detail so OpenCode makes the right changes.
|
||||
|
||||
---
|
||||
|
||||
### [Undo changes](https://opencode.ai/docs#undo-changes)
|
||||
|
||||
Let’s say you ask OpenCode to make some changes.
|
||||
|
||||
```
|
||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||
```
|
||||
|
||||
But you realize that it is not what you wanted. You **can undo** the changes using the `/undo` command.
|
||||
|
||||
```
|
||||
/undo
|
||||
```
|
||||
|
||||
OpenCode will now revert the changes you made and show your original message again.
|
||||
|
||||
```
|
||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||
```
|
||||
|
||||
From here you can tweak the prompt and ask OpenCode to try again.
|
||||
|
||||
Tip
|
||||
|
||||
You can run `/undo` multiple times to undo multiple changes.
|
||||
|
||||
Or you **can redo** the changes using the `/redo` command.
|
||||
|
||||
```
|
||||
/redo
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## [Share](https://opencode.ai/docs#share)
|
||||
|
||||
The conversations that you have with OpenCode can be [shared with your team](https://opencode.ai/docs/share).
|
||||
|
||||
```
|
||||
/share
|
||||
```
|
||||
|
||||
This will create a link to the current conversation and copy it to your clipboard.
|
||||
|
||||
Note
|
||||
|
||||
Conversations are not shared by default.
|
||||
|
||||
Here’s an [example conversation](https://opencode.ai/s/4XP1fce5) with OpenCode.
|
||||
|
||||
---
|
||||
|
||||
## [Customize](https://opencode.ai/docs#customize)
|
||||
|
||||
And that’s it! You are now a pro at using OpenCode.
|
||||
|
||||
To make it your own, we recommend [picking a theme](https://opencode.ai/docs/themes), [customizing the keybinds](https://opencode.ai/docs/keybinds), [configuring code formatters](https://opencode.ai/docs/formatters), [creating custom commands](https://opencode.ai/docs/commands), or playing around with the [OpenCode config](https://opencode.ai/docs/config).
|
||||
@@ -1,31 +1,31 @@
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [claude-code, claude-skills, trae]
|
||||
---
|
||||
|
||||
|
||||
#claude-skills #claude-code #trae
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Claude Code Templates - Skills
|
||||
https://www.aitmpl.com/skills
|
||||
|
||||
## Claude Code Templates - Agents
|
||||
https://www.aitmpl.com/agents
|
||||
|
||||
## Claude Code Templates - MCP
|
||||
https://www.aitmpl.com/mcps
|
||||
|
||||
|
||||
直接进入项目目录后执行 `npx`命令比如：
|
||||
https://www.aitmpl.com/component/skill/git-commit-helper
|
||||
```
|
||||
npx claude-code-templates@latest --skill=development/git-commit-helper --yes
|
||||
---
|
||||
title:
|
||||
source:
|
||||
author: shenwei
|
||||
published:
|
||||
created:
|
||||
description:
|
||||
tags: [claude-code, claude-skills, trae]
|
||||
---
|
||||
|
||||
|
||||
#claude-skills #claude-code #trae
|
||||
|
||||
```table-of-contents
|
||||
```
|
||||
|
||||
## Claude Code Templates - Skills
|
||||
https://www.aitmpl.com/skills
|
||||
|
||||
## Claude Code Templates - Agents
|
||||
https://www.aitmpl.com/agents
|
||||
|
||||
## Claude Code Templates - MCP
|
||||
https://www.aitmpl.com/mcps
|
||||
|
||||
|
||||
直接进入项目目录后执行 `npx`命令比如：
|
||||
https://www.aitmpl.com/component/skill/git-commit-helper
|
||||
```
|
||||
npx claude-code-templates@latest --skill=development/git-commit-helper --yes
|
||||
```
|
||||
@@ -1,211 +1,211 @@
|
||||
---
|
||||
title: vibe-coding-cn/i18n/zh/documents/Methodology and Principles/A Formalization of Recursive Self-Optimizing Generative Systems.md at main · 2025Emma/vibe-coding-cn
|
||||
source: https://github.com/2025Emma/vibe-coding-cn/blob/main/i18n/zh/documents/Methodology%20and%20Principles/%E5%BC%80%E5%8F%91%E7%BB%8F%E9%AA%8C.md
|
||||
author: shenwei
|
||||
published:
|
||||
created: 2025-12-30
|
||||
description: Contribute to 2025Emma/vibe-coding-cn development by creating an account on GitHub.
|
||||
tags: []
|
||||
---
|
||||
|
||||
|
||||
|
||||
|
||||
## 开发经验与项目规范整理文档
|
||||
|
||||
## 目录
|
||||
|
||||
1. 变量名维护方案
|
||||
2. 文件结构与命名规范
|
||||
3. 编码规范（Coding Style Guide）
|
||||
4. 系统架构原则
|
||||
5. 程序设计核心思想
|
||||
6. 微服务
|
||||
7. Redis
|
||||
8. 消息队列
|
||||
|
||||
---
|
||||
|
||||
## 1\. 变量名维护方案
|
||||
|
||||
## 1.1 新建“变量名大全文件”
|
||||
|
||||
建立一个统一的变量索引文件，用于 AI 以及团队整体维护。
|
||||
|
||||
### 文件内容包括（格式示例）：
|
||||
|
||||
| 变量名 | 变量注释（描述） | 出现位置（文件路径） | 出现频率（统计） |
|
||||
| --- | --- | --- | --- |
|
||||
| user\_age | 用户年龄 | /src/user/profile.js | 12 |
|
||||
|
||||
### 目的
|
||||
|
||||
- 统一变量命名
|
||||
- 方便全局搜索
|
||||
- AI 或人工可统一管理、重构
|
||||
- 降低命名冲突和语义不清晰带来的风险
|
||||
|
||||
---
|
||||
|
||||
## 2\. 文件结构与命名规范
|
||||
|
||||
## 2.1 子文件夹内容
|
||||
|
||||
每个子目录中需要包含：
|
||||
|
||||
- `agents` —— 负责自动化流程、提示词、代理逻辑
|
||||
- `claude.md` —— 存放该文件夹内容的说明文档、设计思路与用途
|
||||
|
||||
## 2.2 文件命名规则
|
||||
|
||||
- 使用 **小写英文 + 下划线** 或 **小驼峰** （视语言而定）
|
||||
- 文件名需体现内容职责
|
||||
- 避免缩写与含糊不清的命名
|
||||
|
||||
示例：
|
||||
|
||||
- `user_service.js`
|
||||
- `order_processor.py`
|
||||
- `config_loader.go`
|
||||
|
||||
## 2.3 变量与定义规则及解释
|
||||
|
||||
- 命名尽可能语义化
|
||||
- 遵循英语语法逻辑（名词属性、动词行为）
|
||||
- 避免 `a, b, c` 此类无意义名称
|
||||
- 常量使用大写 + 下划线（如： `MAX_RETRY_COUNT` ）
|
||||
|
||||
---
|
||||
|
||||
## 3\. 编码规范
|
||||
|
||||
每个文件、每个类、每个函数应只负责一件事。
|
||||
|
||||
- 提炼公共逻辑
|
||||
- 避免重复代码（DRY）
|
||||
- 模块化、函数化，提高复用价值
|
||||
|
||||
系统行为应明确划分：
|
||||
|
||||
| 概念 | 说明 |
|
||||
| --- | --- |
|
||||
| 消费端 | 接收外部数据或依赖输入的地方 |
|
||||
| 生产端 | 生成数据、输出结果的地方 |
|
||||
| 状态（变量） | 存储当前系统信息的变量 |
|
||||
| 变换（函数） | 处理状态、改变数据的逻辑 |
|
||||
|
||||
明确区分 **输入 → 处理 → 输出** ，并独立管理每个环节。
|
||||
|
||||
### 3.4 并发（Concurrency）
|
||||
|
||||
- 清晰区分共享资源
|
||||
- 避免数据竞争
|
||||
- 必要时加锁或使用线程安全结构
|
||||
- 区分“并发处理”和“异步处理”的差异
|
||||
|
||||
---
|
||||
|
||||
## 4\. 系统架构原则
|
||||
|
||||
### 4.1 先梳理清楚架构
|
||||
|
||||
在写代码前先明确：
|
||||
|
||||
- 模块划分
|
||||
- 输入输出
|
||||
- 数据流向
|
||||
- 服务边界
|
||||
- 技术栈
|
||||
- 依赖关系
|
||||
|
||||
严谨开发流程：
|
||||
|
||||
1. 先理解需求
|
||||
2. 保持架构与代码简单
|
||||
3. 写可维护的自动化测试
|
||||
4. 小步迭代，不做大爆炸开发
|
||||
|
||||
---
|
||||
|
||||
## 5\. 程序设计核心思想
|
||||
|
||||
## 5.1 从问题开始，而不是从代码开始
|
||||
|
||||
编程的第一步永远是： **你要解决什么问题？**
|
||||
|
||||
复杂问题拆解为可独立完成的小单元。
|
||||
|
||||
减少复杂度、魔法代码、晦涩技巧。
|
||||
|
||||
用函数、类、模块复用逻辑，不要复制粘贴。
|
||||
|
||||
## 5.5 清晰的命名
|
||||
|
||||
- `user_age` 比 `a` 清晰
|
||||
- `get_user_profile()` 比 `gp()` 清晰 命名要体现 **用途** 和 **语义** 。
|
||||
|
||||
## 5.6 单一职责
|
||||
|
||||
一个函数只处理一个任务。
|
||||
|
||||
## 5.7 代码可读性优先
|
||||
|
||||
你写的代码是给别人理解的，不是来炫技的。
|
||||
|
||||
## 5.8 合理注释
|
||||
|
||||
注释解释“为什么”，不是“怎么做”。
|
||||
|
||||
先能跑，再让它好看，最后再优化性能。
|
||||
|
||||
## 5.10 错误是朋友，调试是必修课
|
||||
|
||||
阅读报错、查日志、逐层定位，是程序员核心技能。
|
||||
|
||||
永远不要把代码只放本地。
|
||||
|
||||
## 5.12 测试你的代码
|
||||
|
||||
未测试的代码迟早会出问题。
|
||||
|
||||
## 5.13 编程是长期练习
|
||||
|
||||
所有人都经历过：
|
||||
|
||||
- bug 调不出来
|
||||
- 通过时像挖到宝
|
||||
- 看着看着能看懂别人代码
|
||||
|
||||
坚持即是高手。
|
||||
|
||||
---
|
||||
|
||||
## 6\. 微服务
|
||||
|
||||
微服务是一种架构模式，将系统拆解为多个 **独立开发、独立部署、独立扩容** 的服务。
|
||||
|
||||
特点：
|
||||
|
||||
- 每个服务处理一个业务边界（Bounded Context）
|
||||
- 服务间通过 API 通信（HTTP、RPC、MQ 等）
|
||||
- 更灵活、更可扩展、容错更高
|
||||
|
||||
---
|
||||
|
||||
Redis 的作用：
|
||||
|
||||
- 作为缓存极大提升系统“读性能”
|
||||
- 降低数据库压力
|
||||
- 提供计数、锁、队列、Session 等能力
|
||||
- 让系统更快、更稳定、更抗压
|
||||
|
||||
---
|
||||
|
||||
消息队列用于服务之间的“异步通信”。
|
||||
|
||||
作用：
|
||||
|
||||
- 解耦
|
||||
- 削峰填谷
|
||||
- 异步任务处理
|
||||
---
|
||||
title: vibe-coding-cn/i18n/zh/documents/Methodology and Principles/A Formalization of Recursive Self-Optimizing Generative Systems.md at main · 2025Emma/vibe-coding-cn
|
||||
source: https://github.com/2025Emma/vibe-coding-cn/blob/main/i18n/zh/documents/Methodology%20and%20Principles/%E5%BC%80%E5%8F%91%E7%BB%8F%E9%AA%8C.md
|
||||
author: shenwei
|
||||
published:
|
||||
created: 2025-12-30
|
||||
description: Contribute to 2025Emma/vibe-coding-cn development by creating an account on GitHub.
|
||||
tags: []
|
||||
---
|
||||
|
||||
|
||||
|
||||
|
||||
## 开发经验与项目规范整理文档
|
||||
|
||||
## 目录
|
||||
|
||||
1. 变量名维护方案
|
||||
2. 文件结构与命名规范
|
||||
3. 编码规范（Coding Style Guide）
|
||||
4. 系统架构原则
|
||||
5. 程序设计核心思想
|
||||
6. 微服务
|
||||
7. Redis
|
||||
8. 消息队列
|
||||
|
||||
---
|
||||
|
||||
## 1\. 变量名维护方案
|
||||
|
||||
## 1.1 新建“变量名大全文件”
|
||||
|
||||
建立一个统一的变量索引文件，用于 AI 以及团队整体维护。
|
||||
|
||||
### 文件内容包括（格式示例）：
|
||||
|
||||
| 变量名 | 变量注释（描述） | 出现位置（文件路径） | 出现频率（统计） |
|
||||
| --- | --- | --- | --- |
|
||||
| user\_age | 用户年龄 | /src/user/profile.js | 12 |
|
||||
|
||||
### 目的
|
||||
|
||||
- 统一变量命名
|
||||
- 方便全局搜索
|
||||
- AI 或人工可统一管理、重构
|
||||
- 降低命名冲突和语义不清晰带来的风险
|
||||
|
||||
---
|
||||
|
||||
## 2\. 文件结构与命名规范
|
||||
|
||||
## 2.1 子文件夹内容
|
||||
|
||||
每个子目录中需要包含：
|
||||
|
||||
- `agents` —— 负责自动化流程、提示词、代理逻辑
|
||||
- `claude.md` —— 存放该文件夹内容的说明文档、设计思路与用途
|
||||
|
||||
## 2.2 文件命名规则
|
||||
|
||||
- 使用 **小写英文 + 下划线** 或 **小驼峰** （视语言而定）
|
||||
- 文件名需体现内容职责
|
||||
- 避免缩写与含糊不清的命名
|
||||
|
||||
示例：
|
||||
|
||||
- `user_service.js`
|
||||
- `order_processor.py`
|
||||
- `config_loader.go`
|
||||
|
||||
## 2.3 变量与定义规则及解释
|
||||
|
||||
- 命名尽可能语义化
|
||||
- 遵循英语语法逻辑（名词属性、动词行为）
|
||||
- 避免 `a, b, c` 此类无意义名称
|
||||
- 常量使用大写 + 下划线（如： `MAX_RETRY_COUNT` ）
|
||||
|
||||
---
|
||||
|
||||
## 3\. 编码规范
|
||||
|
||||
每个文件、每个类、每个函数应只负责一件事。
|
||||
|
||||
- 提炼公共逻辑
|
||||
- 避免重复代码（DRY）
|
||||
- 模块化、函数化，提高复用价值
|
||||
|
||||
系统行为应明确划分：
|
||||
|
||||
| 概念 | 说明 |
|
||||
| --- | --- |
|
||||
| 消费端 | 接收外部数据或依赖输入的地方 |
|
||||
| 生产端 | 生成数据、输出结果的地方 |
|
||||
| 状态（变量） | 存储当前系统信息的变量 |
|
||||
| 变换（函数） | 处理状态、改变数据的逻辑 |
|
||||
|
||||
明确区分 **输入 → 处理 → 输出** ，并独立管理每个环节。
|
||||
|
||||
### 3.4 并发（Concurrency）
|
||||
|
||||
- 清晰区分共享资源
|
||||
- 避免数据竞争
|
||||
- 必要时加锁或使用线程安全结构
|
||||
- 区分“并发处理”和“异步处理”的差异
|
||||
|
||||
---
|
||||
|
||||
## 4\. 系统架构原则
|
||||
|
||||
### 4.1 先梳理清楚架构
|
||||
|
||||
在写代码前先明确：
|
||||
|
||||
- 模块划分
|
||||
- 输入输出
|
||||
- 数据流向
|
||||
- 服务边界
|
||||
- 技术栈
|
||||
- 依赖关系
|
||||
|
||||
严谨开发流程：
|
||||
|
||||
1. 先理解需求
|
||||
2. 保持架构与代码简单
|
||||
3. 写可维护的自动化测试
|
||||
4. 小步迭代，不做大爆炸开发
|
||||
|
||||
---
|
||||
|
||||
## 5\. 程序设计核心思想
|
||||
|
||||
## 5.1 从问题开始，而不是从代码开始
|
||||
|
||||
编程的第一步永远是： **你要解决什么问题？**
|
||||
|
||||
复杂问题拆解为可独立完成的小单元。
|
||||
|
||||
减少复杂度、魔法代码、晦涩技巧。
|
||||
|
||||
用函数、类、模块复用逻辑，不要复制粘贴。
|
||||
|
||||
## 5.5 清晰的命名
|
||||
|
||||
- `user_age` 比 `a` 清晰
|
||||
- `get_user_profile()` 比 `gp()` 清晰 命名要体现 **用途** 和 **语义** 。
|
||||
|
||||
## 5.6 单一职责
|
||||
|
||||
一个函数只处理一个任务。
|
||||
|
||||
## 5.7 代码可读性优先
|
||||
|
||||
你写的代码是给别人理解的，不是来炫技的。
|
||||
|
||||
## 5.8 合理注释
|
||||
|
||||
注释解释“为什么”，不是“怎么做”。
|
||||
|
||||
先能跑，再让它好看，最后再优化性能。
|
||||
|
||||
## 5.10 错误是朋友，调试是必修课
|
||||
|
||||
阅读报错、查日志、逐层定位，是程序员核心技能。
|
||||
|
||||
永远不要把代码只放本地。
|
||||
|
||||
## 5.12 测试你的代码
|
||||
|
||||
未测试的代码迟早会出问题。
|
||||
|
||||
## 5.13 编程是长期练习
|
||||
|
||||
所有人都经历过：
|
||||
|
||||
- bug 调不出来
|
||||
- 通过时像挖到宝
|
||||
- 看着看着能看懂别人代码
|
||||
|
||||
坚持即是高手。
|
||||
|
||||
---
|
||||
|
||||
## 6\. 微服务
|
||||
|
||||
微服务是一种架构模式，将系统拆解为多个 **独立开发、独立部署、独立扩容** 的服务。
|
||||
|
||||
特点：
|
||||
|
||||
- 每个服务处理一个业务边界（Bounded Context）
|
||||
- 服务间通过 API 通信（HTTP、RPC、MQ 等）
|
||||
- 更灵活、更可扩展、容错更高
|
||||
|
||||
---
|
||||
|
||||
Redis 的作用：
|
||||
|
||||
- 作为缓存极大提升系统“读性能”
|
||||
- 降低数据库压力
|
||||
- 提供计数、锁、队列、Session 等能力
|
||||
- 让系统更快、更稳定、更抗压
|
||||
|
||||
---
|
||||
|
||||
消息队列用于服务之间的“异步通信”。
|
||||
|
||||
作用：
|
||||
|
||||
- 解耦
|
||||
- 削峰填谷
|
||||
- 异步任务处理
|
||||
- 提高系统稳定性与吞吐
|
||||
Reference in New Issue
Block a user