整理了一下react16.7.0的webpack模板
基本上react需要方法和依赖的库都引配好了。github地址:https://github.com/qianxiaoning/demo-react16.7.0 欢迎大家star或者fork呀~
template-antDesign-sass-react16.7.0
- 目录结构
build/ 生成目录
public/ 静态资源目录,create-react-app会直接把这里的东西起在服务根目录
src/
assets/ 资源文件夹,如图片
components/ 组件
ReactSlotPra 弹窗组件,引用父组件传入的slot数据
ReduxSon redux的修改
Son 事件总线的发射
config/ 参数文件夹
pages/ 页面文件夹
Home 1.react中input的写法
2.react中组件slot的实现方式
News react中组件slot的实现方式
Product 嵌套路由的实现
ParentSonTransmit 1.父子通讯的方式
2.事件总线的监听与销毁
ReduxExperience redux的引用
HocPra 使用hoc高阶组件的公共方法
HttpPra 1.axios请求试验
2.引入antd库
redux/ redux文件夹
router/ router配置
structures/ 结构组件
utils/
events.js 事件总线模块
hoc.js hoc高阶组件(也可以写一些公共的东西,用来替代mixins)
http.js http请求和antd的loading,message的结合封装
urls.js 接口地址的统一管理
utils.js 公共方法,工具函数
AppNote.js 笔记文件
index.js 入口文件
index.scss 公共样式
config-overrides.js customize-cra对create-react-app的webpack的可配置,如为了antd配置了babel-plugin-import
jsconfig.json create-react-app的配置文件,现在只配了项目资源可以绝对路径
package.json proxy设置的地方
整理了一下react16.7.0的webpack模板的更多相关文章
- 从0构建webpack开发环境(一) 一个简单webpack.config.js
本文基于webpack4.X,使用的包管理工具是yarn 概念相关就不搬运了,直接开始 首先项目初始化 mkdir webpack-demo && cd webpack-demo ya ...
- Vue.js系列之项目搭建(vue2.0 + vue-cli + webpack )
1.安装node node.js环境(npm包管理器) cnpm npm的淘宝镜像 从node.js官网下载并安装node,安装过程很简单,一路“下一步”就可以了(傻瓜式安装).安装完成之后,打开命令 ...
- vue-cli的webpack模板项目配置文件分析
由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西,开发过程中需要改动到build和config里面一些相关的配置,所以刚好趁此机会将所有配置文件看一遍,理一理思路,也便于以后修 ...
- vue-cli的webpack模板项目配置文件说明
如果没有vue-cli,那么进行vue项目的开发环境配置将是很费力的一件事情,现在脚手架可以快速构建一个开发环境,是很不错的.不过对于脚手架构建的配置,还是要大概了解一下,方便自己调试配置. 初始化一 ...
- 《转》vue-cli的webpack模板项目配置文件注释
一.文件结构 本文主要分析开发(dev)和构建(build)两个过程涉及到的文件,故下面文件结构仅列出相应的内容. ├─build │ ├─build.js │ ├─check-versions.js ...
- [置顶] vue-cli的webpack模板项目配置文件分析
2017-09-11更新:更新到webpack 2.6.1所对应的配置,完善部分代码注释. 由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西,开发过程中需要改动到build和c ...
- 公共组件及脚手架webpack模板
一.公共组件的创建和使用 前面已经学习vue组件时,了解了公共组件,但在脚手架项目中只使用过局部组件.这里是讲解全局组件如何在脚手架项目中去使用. 1.创建全局组件 在src/components/C ...
- Spring Boot 2.0 整合 FreeMarker 模板引擎
本篇博文将和大家一起使用Spring Boot 2.0 和FreeMarker 模板引擎整合实战. 1. 创建新的项目 2. 填写项目配置信息 3. 勾选web 模块 4. 勾选freemarker模 ...
- Spring Boot 2.0 整合Thymeleaf 模板引擎
本节将和大家一起实战Spring Boot 2.0 和thymeleaf 模板引擎 1. 创建项目 2. 使用Spring Initlizr 快速创建Spring Boot 应用程序 3. 填写项目配 ...
随机推荐
- ie8 下margin-top失效的小案例
一个小案例,是关于IE8下的margin-top的失效问题,巨日代码如下: 正常的chrome浏览器下的显示如下: margin-top=10px,正常显示 但是在ie8下,最终样式如下: margi ...
- Maple拥有优秀的符号计算和数值计算能力
https://www.maplesoft.com/products/maple/ Maple高级应用和经典实例: https://wenku.baidu.com/view/f246962107221 ...
- Net Transport
在调用第三方请求时,正确使用Client也不是一件非常容易的事. 下面是截取的一段描述,建议Client或Transport在整个服务期间最好是全局单例的,Transport本身会维护连接的状态,而且 ...
- 使用multiprocessing的问题总结
Python2中的multiprocessing模块,规避了GIL(Global Interpreter Lock)带来的多线程无法实际并发的缺点,设计了几乎与threading模块一模一样的API, ...
- asp.net ajax客户端框架如何调用Web Service
asp.net ajax客户端框架如何调用Web Service 1:Web Service类添加 [System.Web.Script.Services.ScriptService]特性2:需要异步 ...
- laravel 博客项目部署到Linux系统后报错 权限都设置为777,仍然报错没有权限
阿里工程师最后给出解决方案.
- Android EditText____TextchangedListener
今天在做APP的时候有个需求: EditText 动态监听内容变化如果长度为6时(就是看是不是验证码) 判断是否正确 正确就跳到下一个Activity,但是在Activity.finish()的时候, ...
- 25-1 request模块介绍
requests模块 - 基于如下5点展开requests模块的学习 什么是requests模块 requests模块是python中原生的基于网络请求的模块,其主要作用是用来模拟浏览器发起请求.功能 ...
- OpenKruise - 云原生应用自动化引擎正式开源
2019 年 6 月 24 日至 26 日, 由 Cloud Native Computing Foundation (CNCF) 主办的云原生技术大会 KubeCon + CloudNativeCo ...
- jQuery 无刷新评论
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...