Skip to content

简洁,实用react脚手架,没有多余的文件,基于Webpack自定义React脚手架 ,项目结构模块化,组件化, ssr , react服务端渲染,react +ts + webpack +router+redux + ssr js/css抽离与压缩 多进程打包 路由懒加载

Notifications You must be signed in to change notification settings

fzz14hao/my-react-app

Repository files navigation

react 脚手架

说明

一个简洁,可用的react脚手架,实用脚手架,优秀react脚手架,
基于Webpack自定义React脚手架, 项目结构模块化分布
webpack 自定义配置 ,js/css抽离与压缩, 多进程打包, ssr预渲染
,多页面入口,router 路由懒加载

react +webpack +router + redux +ssr

注:(不同分支有不同功能,以便适应不同需求)

使用项目

git clone https://github.com/fzz14hao/my-react-app.git

安装依赖

npm install

启动项目

npm run dev

线上打包

npm run build

目录结构

    │── dist                     //打包输出文件
    │   ├── css
    │   │  
    │   ├── index.html
    │   └── js
    │
    │
    │  
    ├── src
    │   ├── README.md
    │   ├── assets                 //静态图片
    │   │   └── README.md
    │   ├── components             //公用模版
    │   │   └── README.md
    │   ├── index.html             //入口Html
    │   ├── index.js               //入口文件
    │   ├── pages                  //页面文件夹
    │   │   ├── Index              // 首页页面
    │   │   │   ├── assets         //页面静态图片
    │   │   │   │   └── README.md
    │   │   │   ├── components     //页面模版
    │   │   │   │   └── README.md
    │   │   │   ├── index.js        //页面入口文件
    │   │   │   └── index.less      //页面less
    │   │   ├── Login               //登录页面
    │   │   │   ├── index.js
    │   │   │   └── index.less
    │   │   └── README.md
    │   ├── router                  //路由
    │   │   ├── README.md
    │   │   └── index.js
    │   └── utils                   //公用函数
    │       └── README.md
    │
    ├── webpack                     //webpack配置
    │   ├── paths.js                //常用文件夹路径
    │   ├── webpack.common.js       //公共配置
    │   ├── webpack.dev.js          //开发环境配置
    │   └── webpack.prod.js         //生产环境配置
    │
    │
    └── package.json


分支功能说明

不同分支有不同功能,以便适应不同需求
master分支
纯react +webpack +router结构,没有多余文件
react-typescript分支
react +webpack +router+ts 
react-redux-app分支
react +webpack +router + redux 结构,引入redux 并数据持久化
react-multiple-page-app
react +webpack +router 多入口配置
react-ssr-app分支
react +webpack +router + ssr 结构,引入 prerender-spa-plugin预渲染
react-utils-app分支
react +webpack +router + antd-mobile  结构,带有一些简单的公用函数 如:请求方法,cookie操作,storage操作,时间格式化等方法

About

简洁,实用react脚手架,没有多余的文件,基于Webpack自定义React脚手架 ,项目结构模块化,组件化, ssr , react服务端渲染,react +ts + webpack +router+redux + ssr js/css抽离与压缩 多进程打包 路由懒加载

Resources

Stars

Watchers

Forks

Packages

No packages published