Coder Social home page Coder Social logo

zidoshare / react-ssr-starter Goto Github PK

View Code? Open in Web Editor NEW
4.0 3.0 1.0 137 KB

:bomb: react 的 服务端渲染脚手架,基于react16.x、react-router-v5、webpack3.x构建

JavaScript 97.65% CSS 0.68% HTML 1.67%
react ssr react-router-v5 webpack3 nodejs koa2 reactv16-ssr

react-ssr-starter's Introduction

react-ssr-starter

react 服务端渲染脚手架

开发与构建

开发环境

npm run start

开发环境下,使用devServer做为服务器。

生成环境

npm run build

会构建两个目录,分别时build目录和dist目录。

  • build/:nodejs执行目录,运行时执行 node ./build/server.build.js即可

  • dist/:前端页面目录,必须存在。server.js会读取dist目录中的文件

另外可以分别执行npm run build:clientnpm run build:server构建项目

约定

  • 路由配置放在src/Routes.jsx中。可选择使用react-loadable进行代码分离。每个route带有一个init属性,服务端会读取此属性并执行此方法(用来初始数据)。
  • 默认集成eslint。在vscode中安装eslint插件可检测。开发风格偏向tab:2 no-semi sigle-quotes类似的简单风格
  • .browserslistrc:postcss的配置
  • eslint.json: eslint配置

特性说明

  1. 代码热加载
  2. react-router路由继承
  3. 代码分离
  4. redux集成
  5. es6/es7
  6. css/less/sass
  7. koa2

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.