# edit-code

**Repository Path**: rong-wenhao/edit-code

## Basic Information

- **Project Name**: edit-code
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-03-16
- **Last Updated**: 2025-03-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 在线代码编辑器

一个基于 Vue 3 和 Monaco Editor 的在线代码编辑器，支持多种编程语言，提供实时代码执行功能。

## 功能特点

- 支持多种编程语言（JavaScript、Python、C++）
- 代码高亮显示
- 实时代码执行
- 暗色主题
- 自动补全
- 错误提示
- 全屏编辑模式

## 环境要求

- Node.js >= 14.0.0
- npm >= 6.0.0

## 安装步骤

1. 克隆项目到本地：

```bash
git clone [你的项目地址]
cd code-editor
```

2. 安装依赖：

```bash
npm install
```

3. 启动开发服务器：

```bash
npm run dev
```

4. 在浏览器中访问：

```
http://localhost:5173
```

## 使用说明

1. 选择编程语言：
   - 在顶部下拉菜单中选择想要使用的编程语言
   - 目前支持 JavaScript、Python 和 C++

2. 编写代码：
   - 在编辑器中输入或粘贴代码
   - 编辑器支持语法高亮和自动补全

3. 运行代码：
   - 点击右上角的"运行"按钮执行代码
   - 执行结果将显示在底部的输出区域

## 项目结构

```
code-editor/
├── src/
│   ├── components/
│   │   └── CodeEditor.vue    # 主要编辑器组件
│   ├── App.vue              # 根组件
│   └── main.js             # 入口文件
├── public/                 # 静态资源
├── package.json           # 项目配置
└── README.md             # 项目文档
```

## 注意事项

1. 确保后端服务器正在运行，默认地址为 `http://localhost:3000`
2. 如需修改后端服务器地址，请在 `src/components/CodeEditor.vue` 中更新
3. 首次运行时需要联网下载依赖包

## 常见问题

1. 如果遇到 "无法连接到代码执行服务器" 错误：
   - 检查后端服务器是否正在运行
   - 确认服务器地址配置是否正确

2. 如果代码无法执行：
   - 检查网络连接
   - 确保代码语法正确
   - 查看浏览器控制台是否有错误信息

## 贡献指南

欢迎提交 Issue 和 Pull Request 来帮助改进项目。

## 许可证

MIT License