构建首个蓝河应用

开发

开发者可以使用 BlueOS Studio 开发、调试和打包蓝河应用。以下所有的操作均在 BlueOS Studio 中完成，开发者可以点击链接进入工具下载页面，先安装 BlueOS Studio 。

一新建项目 permalink

一、新建项目

新建方法如下：

1. 点击欢迎页「新建工程」、或菜单栏「新建工程」、或快捷入口处「新建工程」，打开新建工程界面；

2. 点击「下一步」 ，填写项目名称、项目路径、应用名称和应用包名，点击「完成」，BlueOS Studio 会在项目路径下，新建项目并自动打开。



二安装依赖 permalink

二、安装依赖

• 准备工作：安装并配置 Node 环境。

• 在 BlueOS Studio，我们提供了方便的方式来安装依赖，如下图示，只要点击「安装依赖」按钮，即可。

• 安装完毕之后，点击「重新启动编译」按钮，即能重新编译；之后编写代码，就能在预览区实时查看效果，而无需其他任何操作。



三文件组织说明 permalink

三、文件组织说明

├── scripts                   工具脚本文件

├── src

│   ├── assets                公用资源

│   │   ├── images            图片资源

│   │   └── styles            应用样式

│   ├── pages                 页面目录

│   │   ├── Demo              应用首页

│   │   └── DemoDetail        应用详情页

│   ├── app.ux                入口文件。

│   └── manifest.json         项目配置文件，配置应用图标、页面路由等

└── jsconfig.json             js 配置文件，用于语法校验

└── package.json              定义项目需要的各种模块及配置信息

四开发调试 permalink

四、开发调试

• BlueOS Studio 支持实时预览功能，开发者只需保存修改后的代码，即可在右侧模拟器实时预览修改效果。你可以通过 BlueOS Studio 下方提供的 DevTools 面板，进行调试样式、查看请求等操作。



开发者可以跟着下面的步骤，一步步完成第一个蓝河应用的构建。

1构建 ui permalink

1.构建 UI

安装依赖后，即可打开 "src/pages/Demo/index.ux"文件，设置