使用 iceworks 创建&开发项目

飞冰（ICE）提供了 iceworks 这个研发工具，支持项目&物料开发。针对项目开发，可以选择原始的 CLI，也可以选择功能更加丰富的 IDE。

使用 IDE

iceworks 定位为企业级中后台领域 IDE，我们希望通过 iceworks 提供前端项目创建、开发、调试及发布的全链路一体化开发流程。

参考安装 iceworks 章节进行安装。

1. 创建项目

1. 点击 + 号按钮；
2. 选择模板；
3. 填写项目信息；
4. 点击进入工作台按钮。

2. 启动调试

1. 在我的项目中点击项目卡片中的编辑按钮进入工作台；
2. 点击导航栏上的启动按钮，首次启动将自动安装依赖，启动成功将在浏览器打开调试页面；
3. 打开资源管理器内 src/page/**/*.jsx 文件，光标定位到需要插入物料的位置；
4. 点击右侧活动栏的展开按钮打开物料面板，点击物料插入到光标位置。

3. 初始化仓库

1. 点击左侧活动栏上的源代码管理按钮，在左侧边栏将打开源代码管理面板；
2. 点击初始化仓库，选择当前项目名初始化一个 Git 仓库；
3. 暂存所有更改，输入提交信息并提交；
4. 拷贝远程仓库 URL；
5. 通过 ⇧⌘P 唤起命令面板，输入 Git: 添加远程库；
6. 输入远程库名称和 URL；
7. 点击源代码管理面板右上角的 ... 查看更多操作，点击发布分支将分支发布到远程仓库。

4. 发布

仅适用于阿里内部，需要手动在 DEF 研发平台创建应用，关联上一步初始化的仓库。

1. 在导航栏上的左侧点击请登录；
2. 在源代码管理面板将本地代码改动提交到远程仓库；
3. 在导航栏上的右侧点击发布。

使用 CLI

1. 安装 CLI 工具

$ npm i -g iceworks
$ iceworks --help

2. 初始化项目

$ mkdir ice-project
$ cd ice-project
$ iceworks init
# 或者通过自定义模板创建项目
$ iceworks init project @vue-materials/admin-lite

执行命令后根据需求选择对应模板即可完成项目的创建

3. 项目调试

# 安装依赖，也可使用 yarn
$ npm install
# 启动调试服务
$ npm run start

接着通过代码编辑器编写代码就可以在浏览器中看到效果。

4. 项目构建

# 启动调试服务
$ npm run build

执行完成后会在 build 目录下生成 js/index.js 和 css/index.css 文件，只需要在对应 HTML 中引入这两个文件即可渲染出页面。