Skip to content

CodeLittlePrince/react-webapp-spa

Repository files navigation

如何运行

  1. 开发环境:先运行npm run mock开启本地模拟数据,然后npm run dev
  2. 发布环境:运行npm run build

react-webapp-spa

目前已完成:

  1. webpack v3 前端工程:dev、mock、build
    • dev为本地开发环境,使用eslint、postcss、webpack-dev-server等工具
    • mock为本地模拟数据,通过koa2来处理本地的前端请求
    • build是发布环境,npm run build以后会生成build目录及相关文件。会将package.json里的dependencies打包成vendor.[hash].js,页面中js代码打包为app.[hash].js,scss打包为app.[hash].css,给图片和font加hash,然后压缩CSS、JS、图片。
  2. react + react-redux + react-router v4 实现页面首页、城市页、搜索结果页、轮播图、下拉加载更多、搜索等功能。
  3. react 热更新
  4. 使用dynamic import将JS按页面代码分离,加速了首屏显示
  5. scope hosting

之后要做:

  1. SSR,为了SEO和防止一开始白屏
  2. 移植项目到react-naive
  3. 发布几篇详细的文章

预览图

1

2

3

4

About

React SPA实际项目的架构实践

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published