由一系列heirloom子项目/插件构成的模板工程。
要求使用者需要具备一些基本的react以及redux框架的知识。
整套脚手架遵循规约重于配置的策略,最大程度简化前端杂七杂八的框架或工具的学习成本,开发者只需要专注于编写业务逻辑和单元测试。
规约
大多借鉴自现有的一些标准或知识体系。
相关项目
快速开始
全局安装yeoman(如果已安装,请跳过该步骤):
npm -g install yo
npm -g install generator-heirloom
新建工程(或者将example
替换为你的项目名称):
yo heirloom example
等待一切安装结束后:
cd example
创建并编辑api/__mocks__/sample.js
文件:
// GET请求
exports.get = function (ctx) {
ctx.body = 'staging';
};
创建并编辑api/sample.js
文件:
// GET请求
exports.get = function (ctx) {
ctx.body = 'production';
};
创建并编辑public/sample/index.js
文件:
import 'babel-polyfill';
import 'isomorphic-fetch';
const p = document.createElement('p');
document.body.appendChild(p);
(async function () {
const response = await fetch('/api/sample');
if (response.ok) {
p.innerText = await response.text();
p.style.color = 'green';
} else {
p.innerText = '请求失败!';
p.style.color = 'red';
}
})();
创建并编辑public/sample/package.json
文件:
{
"name": "sample"
}
在example
项目根目录下,命令行终端执行:
yarn dev
浏览器访问:
open http://localhost:3000/sample // staging
结束之前执行yarn dev
所启动的进程,后执行:
yarn start
浏览器访问:
open http://localhost:3000/sample // production