@symph/joy
介绍
https://lnlfps.github.io/symph-joy
@symph/joy的目标是创建愉悦的前端应用,拥有了next.js的服务端渲染和零配置能力,也能像dva一样轻松的开发前端业务。
该项目已在生产环境使用,如有任何疑问、使用帮助、bug反馈、特性讨论,请联系我们,或者到github创建issue,也非常欢迎加入我们。
特征
- 零配置可用,快速开发,已集成react、redux、react-router4和ES6、7语法支持等
- 支持服务端渲染,只需在Component中添加
async componentPrepare()
一个方法获取组件数据 - 支持静态版本导出,脱离Node.js运行,也可单独导出静态页面
- 展现组件上支持aync语法来编排业务逻辑,监听业务执行结
- 使用model层统一管理业务逻辑,仅用4个api简化redux的使用,并支持async方法、任务调度和model状态管理等
- 使用
@
装饰器的方式,动态注册model和controller,应用结构更清晰,耦合度也更低 - 内置业务请求转发服务,在Node.js的支持下,不再困扰跨域问题
- 支持插件化配置
安装和开始
运行npm init
创建一个空工程,并填写项目的基本信息,当然也可以在一个已有的项目中直接安装。
npm install --save @symph/joy react react-dom
@symph/joy 只支持 React 16及以上版本
添加NPM脚本到package.json文件:
{
"scripts": {
"dev": "joy",
"build": "joy build",
"start": "joy start"
}
}
然后就可以开始你的开发工作了,创建./src/index.js
文件,并插入以下代码:
export default () => <div>Welcome to @symph/joy!</div>
最后运行npm run dev
命令,在浏览器中输入访问地址http://localhost:3000
。如果需要使用其它端口来启动应用 npm run dev -- -p <your port here>
到目前为止,一个简单完整的react app已经创建完成.
文档
https://lnlfps.github.io/symph-joy
快速连接: