--- title: '构建首个蓝河应用' description: '> 本文将从开发工具、新建项目、安装依赖、调试项目、打包等方面入手，让您学习后，可以构建首个蓝河应用。' lastUpdated: 2025-10-09T03:25:10.000Z --- > 本文将从开发工具、新建项目、安装依赖、调试项目、打包等方面入手，让您学习后，可以构建首个蓝河应用。 ## 开发 开发者可以使用 BlueOS Studio 开发、调试和打包蓝河应用。以下所有的操作均在 BlueOS Studio 中完成，开发者可以[点击链接进入工具下载页面](https://studio.blueos.com.cn/install)，先安装 BlueOS Studio 。 ### 一、新建项目 新建方法如下： 1. 点击`欢迎页`「**新建工程**」、或`菜单栏`「**新建工程」**、或`快捷入口`处「**新建工程**」，打开新建工程界面； 2. 点击「**下一步**」 ，填写项目名称、项目路径、应用名称和应用包名，点击「**完成**」，BlueOS Studio 会在项目路径下，新建项目并自动打开。  ### 二、安装依赖 - 准备工作：安装并配置 [Node](https://nodejs.org/en) 环境。 - 在 BlueOS Studio，我们提供了方便的方式来安装依赖，如下图示，只要点击「**安装依赖**」按钮，即可。 - 安装完毕之后，点击「**重新启动编译**」按钮，即能重新编译；之后编写代码，就能在预览区实时查看效果，而无需其他任何操作。  ### 三、文件组织说明 ```bash ├── scripts 工具脚本文件 ├── src │ ├── assets 公用资源 │ │ ├── images 图片资源 │ │ └── styles 应用样式 │ ├── pages 页面目录 │ │ ├── Demo 应用首页 │ │ └── DemoDetail 应用详情页 │ ├── app.ux 入口文件。 │ └── manifest.json 项目配置文件，配置应用图标、页面路由等 └── jsconfig.json js 配置文件，用于语法校验 └── package.json 定义项目需要的各种模块及配置信息 ``` ### 四、开发调试 - BlueOS Studio 支持实时预览功能，开发者只需保存修改后的代码，即可在右侧模拟器实时预览修改效果。你可以通过 BlueOS Studio 下方提供的 DevTools 面板，进行调试样式、查看请求等操作。  开发者可以跟着下面的步骤，一步步完成第一个蓝河应用的构建。 #### 1.构建 UI 安装依赖后，即可打开 "src/pages/Demo/index.ux"文件，设置 `