as

Settings
Sign out
Notifications
Alexa
亚马逊应用商店
Ring
AWS
文档
Support
Contact Us
My Cases
新手入门
设计和开发
应用发布
参考
支持

创建Hello World应用

创建Hello World应用

本教程将引导您使用Vega SDK的VS Code扩展Vega Studio创建、构建和运行您的第一个Vega应用。此示例基于React Native应用模板创建一个名为VegaProject的应用。该应用运行于Vega虚拟设备中,这是一种Vega SDK中内置的Fire TV Stick模拟器。

如果您想探索所有构建选项,例如使用Vega CLI和其他应用模板,请参阅构建您的应用

先决条件

  • 安装Vega SDK。SDK包含各种工具,用于创建、构建和运行应用。
  • 打开Visual Studio Code或下载它

构建Hello World应用

步骤1: 使用模板创建新应用

首先,您需要使用Vega模板创建一个新应用。

  1. 在VS Code中,单击活动栏的Vega扩展图标Vega图标的屏幕截图。前往该扩展。
  2. 单击+图标创建新项目。
  3. 选择模板hello-world(基于React Native 0.72的模板)。
  4. 选择一个项目目录或创建一个新目录,然后将其打开。
  5. 为项目、程序包命名,并在完成命名之后按Enter。此示例使用以下名称:

    应用名称VegaProject

    程序包名称com.myorg.VegaProject

  6. 出现工作区提示。命名您的工作区并将其保存到您选择的位置。

    工作区提示的屏幕截图,您可以在其中命名工作区并选择保存位置。

步骤2: 构建应用

接下来,在测试模式下构建应用。

  1. 在Vega扩展中,找到并选择工作区中的VegaProject

    在Visual Studio Code中“Projects”(项目)菜单下的VegaProject项目位置的屏幕截图。
  2. 将构建模式设置为Debug(调试)。默认情况下,这会启用快速刷新,因此对应用所做的任何已保存更改都会实时反映在应用中。
  3. 选择VegaProject旁边的构建按钮。

    VegaProject项目构建按钮位置的屏幕截图。
  4. 查看VS Code的Output(输出)选项卡中是否有构建成功消息。

    2025-12-16 15:07:44.151 [信息] [原生构建] kepler ktbuild exited with code 0
    2025-12-16 15:07:44.198 [信息] info build-kepler completed
    

步骤3: 运行Vega虚拟设备 (VVD)

最后,在Vega虚拟设备 (VVD)(即Vega的Fire TV Stick模拟器)中运行该应用。

  1. 在扩展面板中,于Devices(设备)下找到VirtualDevice:Tv,然后按下播放按钮。

    VirtualDevice位置的屏幕截图:电视播放按钮。
  2. 等待VVD窗口打开。
  3. 选择VegaProject旁边的播放按钮。

    VegaProject播放按钮位置的屏幕截图。

当应用运行时,您会看到Hello World应用的VVD更新。

VVD中Vega的Hello World应用模板屏幕截图。

恭喜! 您已经成功创建并运行了自己的第一个Vega应用。尝试更改App.tsx中的一些文本(确保选择了Save[保存]),以查看实时反映在正在运行的应用上的更改。

其他资源

现在您已经创建了第一个Vega应用,请浏览以下资源以了解更多信息:


Last updated: 2025年12月17日