AE-BIU 🔫🔫🔫

Born For AE, Born To Do 🎉🚀👊

为 AE 而生，生来就是干 🎉🚀👊

环境

• Node: ^8.0.0
• npm: ^5

安装

npm install -g ae-biu

发布

发布前请仔细了解发布流程

包含功能

• 初始化项目

# 使用 master 分支作为模板
ae init
# 使用指定分支或者 tag 作为模板
ae init -b <branch-name|tag-name>

• 提取多语言文件

# 使用 package.json 中定义的所有语言
ae i18n
# 指定语言
ae i18n -l en-US,en-GB
ae i18n --lang en-US,en-GB
# 非扁平模式
ae i18n -u
ae i18n --no-flat

• 本地开发

ae dev

• 打包部署

ae build

• 静态文件服务(模拟生产环境)

ae start

• 启动 Mock

ae mock

• 更多命令

ae help

最佳实践

1. 安装 ae-biu
2. 初始化项目 ae init
3. cd <项目文件夹>
4. 启动本地服务 ae dev，默认对接共享平台测试环境，可通过设置 process.env.SDP_ENV 更改
5. 打包部署 ae build，默认打包目录为 ./dist，可在 package.json > ae > output 中指定

主题定制

AE 目前有一套默认的主题，如需定制或修改，只需在 package.json 中设置 ae > theme 即可。

主题分为 AE 与 Fish 两部分，可分别设置。

{
  "ae": {
    "theme": {
      "ae": {},
      "fish": {}
    }
  }
}

Fish

Fish 主题自定义请参考文档，通过 ae-biu，fish 可支持 JSON 或者 JSON 文件的方式设置。

AE

AE 主题支持 JSON 或者 JSON 文件的方式，目前 AE 主题如下

{
  "white": "#FFFFFF",
  "black": "#000000",
  "red": "#FF5745",
  "blue": "#2D8CF0",

  "aside_width": "250px",
  "page_min_width": "980px"
}

如需更多主题项，issues are welcome

自定义 webpack 配置

ae-biu 支持自定义 webpack 配置，只需要在和 package.json 同级目录下放置 webpack 配置文件即可，优先级为：webpack.config.babel.js > webpack.config.js > webpack.js

支持返回 function 或者 object

// function way
export default (config) => {
  // handle config with your code
  return config
}

// object way
export default {
  // webpack config
}

首页 template

首页模板已被整合入 ae-biu。

包括 uc 1.0 以及 uc 0.93 两个版本，默认为 1.0，如需切换只需在 package.json > ae > uc 指定即可。 默认设置的组织名为 nd，如需重新设置只需在 package.json > ae > org 指定即可。

{
  "ae": {
    "org": "ndtest",
    "uc": "0.93"
  }
}

也可以自定义模板，只需在 package.json > ae > template 指定模板路径即可。

多语言

ae-biu 在初始化之时会默认设置多语言为简体中文(zh-CN)与英文(en)，如需更多语言或修改，可在 package.json > ae > languages 中修改，这些修改将会同步反馈到主题的语言选择中。

{
  "ae": {
    "languages": [
      "zh-CN",
      "en"
    ]
  }
}

目前 AE 支持的多语言如下，如需更多支持，issues are welcome

{
 "zh-CN": "简体中文",
 "zh-HK": "繁体中文",
 "en": "English",
 "id": "Bahasa Indonesia",
 "th": "ภาษาไทย",
 "ar": "العربية"
}

Mock Server

ae-biu 支持 Mock Server，其底层依赖于 Express 与 json-server，并在 json-server 的基础之上添加了 REST API 支持，目前支持以下参数:

• $filter
• $offset
• $limit
• $orderby

$count 由于 json-server 限制不能支持，但可以参考 json-server 文档获取此值

若要使用 Mock Server， 需要在与 package.json 同级目录下创建 mock/db.json 即可，db.json 格式请参考 json-server

通过 ae mock 启动 Mock Server 之后，建议配合 Charles 的 MapRemote 或者 Fiddler 的 AutoResponder 实现真实地址映射本地地址，实现更友好的 Mock Server

为多语言文件增加 hash

从 v1.3.0 开始，ae-biu 将支持为多语言文件增加 hash，格式为 [lang].[hash].json，仅在 ae build 下生效

若需要为多语言文件增加 hash，将 package.json > ae > addHashForI18N 设置为 true 即可

添加 polyfills

若需要添加 polyfills，只需要在 package.json > ae > polyfills 中添加即可，如：

{
  "ae": {
    "polyfills": [
      "fetch-polyfill"
    ]
  }
}

举个栗子：ae-boilerplate/mock-uc

Todo

• [x] ae init
• [x] ae i18n
• [x] ae build
• [x] ae dev
• [x] ~~ae lint~~
• [x] ~~ae test~~ 废弃, 请使用 ae unit 以及 ae e2e
• [x] ae e2e
• [ ] ae unit
• [x] ae start
• [x] ae mock

还有很多细节需要优化，欢迎提出 issue 或者 MR，但请遵循贡献指南