webpack-base-demo2.zip
webpack基础demo,可用于构建webpack项目
其中包含了
1 样式加载器css,sass,less
2 图片加载器
3 webpack-dev-server本地开发热更新
4 babel配置:
(1)babel:解决不支持语法转义es6转义为es5
cnpm i --save-dev babel-loader @babel/core @babel/preset-env
(2)babel-polyfill:低版本浏览器中的不支持API,例如findIndex
cnpm i --save-dev babel-polyfill
(3)babel-plugin-transform-runtime: 解决打包体积过大的问题
cnpm i --save-dev @babel/plugin-transform-runtime
cnpm i --save @babel/runtime
在打包的过程中,babel会在包里提供一些工具函数,而这些工具函数可能会重复的出现在多个模块。
这样会导致打包的体积过大,所以babel提供了babel-transform-runtime解决这个体积过大的问题
使用:
1 下载包解压,进入目录
2 安装 npm i 或 cnpm i
3 运行 npm run dev 启动后访问https://127.0.0.4:8088/
4 打包 npm run build
webpack-base-demo.zip
其中包含了:
1 样式加载器css,sass,less
2 图片加载器
3 webpack-dev-server本地开发热更新
使用:
1 下载包解压,进入目录
2 安装 npm i 或 cnpm i
3 运行 npm run dev 启动后访问https://127.0.0.4:8088/
4 打包 npm run build
create-react-app构建dva项目20180728
增加完善音乐模块,列表页增加搜索功能,布局优化;
编辑页增加头像和性别的字段
create-react-app构建dva项目20180724
修正路由问题,layout/auth.js文件中,import { withRouter } from 'dva/router',使用withRouter形式
create-react-app构建dva项目20180702
基于create-react-app官方脚手架搭建dva模式的项目;以react官方脚手架开启项目,安装采用dva方式的,构建项目,展示记录过程中遇到的各种点和Keng,若你也遇到类似问题,也许能帮上你
基于上一版本增加完善部分
create-react-app构建dva项目
基于create-react-app官方脚手架搭建dva模式的项目;以react官方脚手架开启项目,安装采用dva方式的,构建项目,展示记录过程中遇到的各种点和Keng,若你也遇到类似问题,也许能帮上你
iScroll下拉刷新上滑加载
iScroll下拉刷新上滑加载;
使用经典插件iScroll4稍作封装,采用ajax请求数据,实现移动端列表页的功能;
1.下拉刷新当前列表页数据;
2.上滑加载更多列表数据;
iScroll4简介:
iScroll 4 这个版本完全重写了iScroll这个框架的原始代码。这个项目的产生完全是因为移动版webkit浏览器(诸如iPhone,iPad,Android 这些系统上广泛使用)
提供了一种本地化的方式来对一个限定了高度和宽度的元素的内容进行滑动。很不幸的是,这种情况下所有的web应用的页面就不能够包含具有position:absolute的头、页尾或者是一个内容可滚动的
中间区域。
然而,Android系统最新修订版已经可以支持这种功能了(尽管支持的力度还不是特别好),Apple公司似乎不太情愿将one-finger滑动事件运用到div元素上。
除了以前版本的iScroll的特性以外,iScroll 4还包括如下的特性:
(1)缩放(Pinch/Zoom)
(2)拉动刷新(Pull up/down to refresh)
(3)速度和性能提升
(4)精确捕捉元素
(5)自定义滚动条
友情提示:iScroll 4并不是iScroll 3的简易替代版本,API文档已经不一样了。同时考虑到此版本正处于测试期,一些API可能会有细微的变化。
滚动效果的图片demo
一个简单的插件,可用于网页中的滚动效果,虽然简单可是很容易应用在前端开发过程中