Skip to main content

快速开始

CLI 初始化项目#

可以选择使用 npm 或者 yarn 工具进行项目初始化,如下输入项目名即可:

$ npm init ice <projectName>
# or
$ yarn create ice <projectName>

同时支持以下几种方式初始项目,以 npm 为例

# 当前目录初始项目
$ mkdir ice-example && cd ice-example/
$ npm init ice # 根据提示选择模板
$ npm init ice --template <template> # 指定模板
$ npm init ice <projectName> --template @alifd/scaffold-simple # 未使用任何 UI 组件库
$ npm init ice <projectName> --template @alifd/fusion-design-pro-js # 基于 fusion 组件的模板
$ npm init ice <projectName> --template @icedesign/ice-antd-scaffold # 基于 antd 组件的模板
# 指定目录初始项目
$ npm init ice <projectName> # 根据提示选择模板
$ npm init ice <projectName> --template <template> # 指定模板

选择模板#

可以根据实际情况选择 TypeScript 和 JavaScript 模板,其中各包含一个轻量的 Lite 和功能完善的 Pro 模板:

? Please select a template (Use arrow keys)
❯ A lightweight TypeScript template.
A lightweight JavaScript template.
Pro TypeScript template,Integrated rich features such as charts, lists, forms, etc.
Pro JavaScript template,Integrated rich features such as charts, lists, forms, etc

选择模板会自动创建项目,看到如下信息说明项目创建成功:

✔ download npm tarball successfully.
info clean package.json...
Initialize project successfully.
Starts the development server.
cd <projectName>
npm install
npm start
✨ Done

启动项目#

按照上面的提示,进入新建的项目安装依赖即可:

$ cd <projectName>
# 安装依赖
$ npm install
# 启动项目
$ npm start

执行上述命令后,会自动打开浏览器窗口访问 http://localhost:3333,这时应该看到默认的页面。

GUI 初始化项目#

AppWorks 是一款可视化智能研发助手,帮助开发者快速使用可视化和智能化的能力进行应用开发。

安装 AppWorks#

安装

  • 点击 VS Code 活动栏上的「插件市场图标」
  • 在侧边栏的搜索框上输入「AppWorks」
  • 点击侧边栏上出现的搜索结果中的「AppWorks 插件栏」
  • 在主窗口出现的页面上点击「安装」按钮

初始化项目#

创建

  • 点击 VS Code 活动栏上的「AppWorks 图标」
  • 点击侧边栏上的「创建新应用」按钮
  • 在主窗口出现的页面上根据引导创建项目

启动项目#

启动

  • 点击 VS Code 活动栏上的「AppWorks 图标」
  • 鼠标移动到 「NPM 脚本」下的「start 项」
  • 点击 start 项右边的「启动图标」