​
WebIDE 预览

WebIDE 环境特别适用于：

  1. 编写和调试各种编程语言的代码（Java、JavaScript、Python 等）
  2. 具有实时预览功能的 Web 开发项目，请参阅 在 WebIDE 中创建您的第一个 HTML 页面
  3. 通过直观的界面管理项目文件和目录
  4. 集成终端操作以执行命令行任务

​
环境布局

WebIDE 界面由以下几个关键组件组成：

  1. 左侧边栏：
    • 文件资源管理器用于项目导航
    • 搜索功能
    • 用于 Git 操作的源代码控制
    • 扩展面板
  2. 编辑器区域：主编码工作区
  3. 底部面板：终端、问题和输出
  4. 状态栏：快速访问设置和实时预览
  5. 顶部菜单栏：文件、编辑、视图和其他选项

​
终端访问

您可以通过两种方式打开终端：

  1. 点击左下角的 图标，然后切换到终端选项卡；
  2. 使用顶部菜单：终端 > 新建终端

​
预览 HTML

要预览您的 HTML 文件：

  1. 在 WebIDE 中，点击右下角的“Go Live”按钮。
  2. 将打开一个新的浏览器标签页，显示您的 HTML 页面。
  3. 或者，您可以点击“Web 8080”选项卡以打开预览。
  4. 如果您的项目位于子目录下，您可以通过点击资源管理器中的子目录名称来访问它，随后系统会自动预览该目录下的 index.html 文件。
  5. 如果您的项目包含多个 HTML 文件，包括index.html，您可以在 URL 后追加文件名直接预览。例如，https://xxx.labex.io/another-file.html。
  6. 您可以通过点击“在新标签页中打开”按钮，在新标签页中打开预览。这将在新的浏览器标签页中打开预览。

“Go Live”将自动：

  • 启动一个网络服务器
  • 在您修改代码时提供实时更新

这将自动：

  • 启动一个 Web 服务器
  • 在您修改代码时提供实时更新

提示：LabEx VM 在端口 8080 上托管预览。您可以与他人分享预览链接以展示您的工作。当您的实验室虚拟机停止后，预览链接将不再有效。

​
使用场景

​
常见问题