- 博客(131)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 用python读写表格
读操作import xlrdxlsx = xlrd.open_workbook('G:/2020年6月28日夏季第二次派遣库.xlsx')table = xlsx.sheet_by_index(0)# 读取表格的值print(table.cell_value(189, 3))print(table.row(189)[3].value)写操作import xlrdimport xlwt# xlsx = xlrd.open_workbook('G:/2020年6月2
2020-07-08 16:25:54
1002
1
原创 leetcode：反转字符串中的单词 III
三种解法function reverse(arr) { var res = arr.split(' '); for (let i = 0; i < res.length ; i++) { res[i] = res[i].split('').reverse().join(''); } return res.join(' ');}fun...
2019-04-04 19:51:44
392
原创 面试：CSS3新特性
选择器element1~element2:通用用兄弟选择器 [attribute^=value]: 选择某元素attribute属性是以value开头的。 [attribute$=value]: 选择某元素attribute属性是以value结尾的。 [attribute*=value]: 选择某元素attribute属性包含value字符串的。 E:first-of-type: 选...
2019-04-02 20:44:11
486
原创 web-storage-cache.js
文档https://www.npmjs.com/package/web-storage-cache概念WebStorageCache对HTML5localStorage和sessionStorage进行了扩展，添加了超时时间，序列化方法。可以直接存储json对象，同时可以非常简单的进行超时时间的设置。优化：WebStorageCache自动清除访问的过期数据，避免了过期数据的累...
2019-03-29 18:27:45
555
原创 vue中transiton的四个类名的理解
enter-active：整个进入状态一直存在，这个类可以用来定义进入过滤的过程时间，延迟和曲线函数 enter：“进入”的开始状态 enter-to：“进入”的结束状态 leave的一组和上面类似理解1我们可以拿百米赛跑打个比方。我们在起跑的准备阶段即为”enter”的状态；当到达100米这个目标点时，即为“进入”的结束状态；”enter-active”存在于开始状态到结束状态的整个...
2019-03-28 15:35:25
474
原创 读书项目：阅读器翻页功能实现
TouchEvent事件在changeTouches当中有几根手指就有几条数据pageX clientX screenX的区别pageX/pageY：鼠标相对于整个页面的X/Y坐标 整个页面的意思就是你整个网页的全部，比如说网页很宽很长，宽2000px，高3000px，那pageX,pageY的最大值就是它们了 IE不支持 clientX/clientY：事件发生时鼠标...
2019-03-27 19:19:20
3297
1
原创 读书项目：vuex小例子
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="...
2019-03-25 16:18:40
151
原创 读书项目：global.scss和reset.scss设置
reset.scss文档源码：https://gist.github.com/hcatlin/1027867global.scss添加px2rem函数@import './reset.scss';$radio: 37.5;@function px2rem($px) { @return $px/$radio + rem;}
2019-03-25 14:41:00
2067
原创 读书项目：viewport配置和rem设置
viewport配置-禁止缩放<meta name="viewport" content="width=device-width,initial-scale=1.0 maximum-scale=1.0 minimum-scale=1.0 user-scalable=no">自适应remdocument.addEventListener('DOMContentLoaded...
2019-03-25 10:33:43
373
原创 读书项目：项目依赖包
{ "name": "ebook-vue", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build" }, "dependencies": { "epubjs": "^0....
2019-03-25 09:36:18
147
原创 读书项目：准备工作说明
字体图标：矢量图 项目依赖包下载+项目配置 准备Web字体：项目中可以切换字体 viewport设置：禁止用户对浏览器进行缩放 rem设置+自适应布局实现思路 global.scss和reset.scss 引入vuex 搭建静态资源服务器：Nginx，资源包导入服务器中...
2019-03-24 20:10:23
176
原创 读书项目：项目技术难点分析
分布算法阅读器的屏幕尺寸是不一样的，分出来的页数也是不一样的全文搜索算法引入Web字体CSS3中新特性，允许用户自定义字体，可以联网下载主题设计主题一旦发生变化，图文文字的颜色间距就发生变化离线存储机制设计：LocalStorage+IndexedDB实现各种复杂手势+交互动画，兼容手势+鼠标操作利用vuex+mixin实现组件解耦+复用，大大精简代码量利...
2019-03-24 20:04:58
1739
原创 读书项目：epubjs阅读器引擎介绍
概念基于js的开源阅读器引擎 文档：https://github.com/futurepress/epub.js/ 解决了ePub电子书的解析、渲染、定位等技术难题 提供了媲美原生app的阅读体验epub.js核心类介绍Book：完成了阅读器的解析 Rendition：实现了阅读器的渲染 Locations：阅读器的定位 Navigation：存储了目录信息 ViewMa...
2019-03-24 15:45:18
4289
原创 读书项目：ePub标准介绍
ePub是IDPF制定的电子书标准 IDPF（internationaldigitalpublishingforum）国际数字出版论坛，致力于推广电子出版物 ePub标准主要是解决电子书分发、管理和加密问题 ePub核心是：ZIP+XML+资源文件（HTML+CSS+图片+音频+视频等）...
2019-03-24 15:31:53
774
原创 读书项目：阅读器原理介绍
阅读器工作原理将各种格式的电子书，通过阅读器引擎解析为阅读器可识别的格式，然后将解析的结果渲染到界面上，并提供一系列的辅助功能。将epub变成压缩包zip打开rootfile指向了它的内容存储位置打开content.opf文件metedata：电子书的基本信息manifest：电子书所有的资源文件和路径spine：电子书的排列顺序，对资源文件进行排序，那...
2019-03-24 15:25:27
1436
原创 Webpack：环境变量的使用方法
红框中的为全局变量package.json{ "name": "webpack-demo", "sideEffects": [ "*.css" ], "version": "1.0.0", "description": "", "private": true, "main": "index.js", "scripts": { "dev...
2019-03-23 09:51:25
1088
原创 Webpack：Shimming 的作用
Shimming解决的问题引入webpack.ProvidePlugin()解决：如果使用了一些版本比较老的模块如jquery、lodash，这些老模块的用法不是ESModule的使用方式，如果用webpack打包用这种模块会报错，为了解决这样的错误就要用到webpack.ProvidePlugin()概念这个插件就相当于一个垫片问题一个模块中的this指向的是模块自身而...
2019-03-23 09:36:23
1115
原创 Webpack 与浏览器缓存( Caching )
contenthash作用通过使用contenthash，可以做到重新打包代码上线的时候，用户只需要更新有变化的代码，而没有变化的代码，用户可以直接使用本地的缓存contenthash功能源代码发生变化，contenthash则发生变化源代码不变，contenthash不变配置配置代码webpack.common.jsconst HtmlWebpackPl...
2019-03-22 19:52:14
769
原创 Webpack：CSS 文件的代码分割
MiniCssExtractPlugin文档：https://webpack.js.org/plugins/mini-css-extract-plugin 可对css的引入文件进行代码分割 会把css打包成单独的一个文件 这个插件适合在production模式下做打包css in jswebpack在做打包的时候会把css文件打包在js里注意注意treeshaking...
2019-03-22 18:13:55
1343
原创 Webpack：打包分析，Preloading, Prefetching
打包分析概念当用webpack代码打包之后，可以借助打包分析的工具对打包生成的文件进行一定的分析，分析打包是否合理分析工具：https://github.com/webpack/analyse分析工具2：https://alexkuz.github.io/webpack-chart/生成打包过程描述文件把打包描述放置到stats.json里"scripts": { ...
2019-03-22 16:34:46
565
原创 Webpack：Lazy Loading懒加载，Chunk是什么？
Lazy Loading懒加载通过import异步加载一个模块。可以让页面加载速度更快demofunction getComponent() { return import (/* webpackChunkName: "lodash" */ 'lodash').then(( {default: _} ) => { let ele = document.c...
2019-03-22 15:14:18
766
原创 Webpack：SplitChunksPlugin配置参数详解
安装@babel/plugin-syntax-dynamic-import这是动态引入模块的插件npm install --save-dev @babel/plugin-syntax-dynamic-import文档：https://babeljs.io/docs/en/babel-plugin-syntax-dynamic-importcacheGroups缓存组加入引入了两...
2019-03-22 14:49:15
1668
原创 Webpack 和 Code Splitting
概念在一些项目之中，会通过对代码公用部分进行一些拆分，来提升项目运行的速度.通过webpack自带的插件可以自动的做代码分割Code Splitting代码分割如是第三方包的业务代码一起打包，则会带来以下问题：1.打包文件会很大，加载时间长2.重新加载页面，又要加载大文件js内容配置用这种方式，main.js被拆成lodash.js和main.js，当页面业务...
2019-03-22 10:45:26
161
原创 Webpack：Develoment 和 Production 模式的区分打包
配置过程引入webpack-merge安装： npm install webpack-merge -D把webpack.config.js查分成以下三个文件，放入build文件夹中webpack.common.jsconst HtmlWebpackPlugin = require('html-webpack-plugin');const CleanWebpackPlugi...
2019-03-21 10:44:56
324
原创 Webpack： Tree Shaking
概念最理想的打包方式是引入什么打包什么 “把一个模块里没用的菏都摇晃掉” 一个模块可以理解成一个树，树形结构 只打包引入的部分，不引入的部分剔除注意只支持 ES Module development模式默认没有TreeShaking功能 development即使用了TreeShaking，也不会没用的代码把打包生成的文件中去除掉，只会在代码里提示一下。这样做是为了方便调试...
2019-03-21 09:54:01
112
原创 Webpack： 使用 Babel 处理 ES6 语法
文档https://babeljs.io/setup#installation配置首先安装两个包，具体信息如上文档webpack.config.js添加规则使用ployfill兼容更低版本的浏览器文档：https://www.babeljs.cn/docs/usage/polyfill/webapck.config.jsconst path = requ...
2019-03-20 20:37:41
220
原创 Webpack：Hot Module Replacement 热模块更新
HMR功能好处方便调试css，页面不会刷新 热更新js要手动刷新开启HMR功能webpack.config.jsconst path = require('path');const HtmlWebpackPlugin = require('html-webpack-plugin');const CleanWebpackPlugin = require('clea...
2019-03-20 16:34:33
2084
原创 Webpack：使用 WebpackDevServer 提升开发效率
用--watch监听打包文件package.json用WebpackDevServer自动监听自动刷新配置webpack.config.jsconst path = require('path');const HtmlWebpackPlugin = require('html-webpack-plugin');const CleanWebpackPlugin = re...
2019-03-20 14:27:02
586
原创 Webpack：SourceMap 的配置
概念（大白话）解决源代码和目标生成代码的映射关系1.现在知道dist目录下main.js文件第96行出错2.souceMap它是一个映射关系，它知道dist目录下main.js文件96行，实际上对应的是src目录下index.js文件中的第一行3.当前其它是index.js中第一行代码出错了关闭SouceMap开启SourceMap开启SourceMap...
2019-03-20 10:30:38
6798
原创 Webpack：Entry 与 Output 的基础配置
Entry和Output打包多个文件webpack.config.jsconst path = require('path'); //引入node核心模块const HtmlWebpackPlugin = require('html-webpack-plugin');const CleanWebpackPlugin = require('clean-webpack-plugin'...
2019-03-20 09:36:07
659
原创 Webpack：使用plugins让打包更便捷
HtmlWebpackPlugin文档：地址HtmlWebpackPlugin作用HtmlWebpackPlugin会在打包结束后，自动生成一个html文件，并把打包生成的js自动引入到这个html中webpack.config.jsplugin的作用可以在webpack运行到某个时刻的时候，帮你做一些事情。类似于vue的生命周期钩子CleanWebpackP...
2019-03-19 19:00:46
339
原创 Webpack：使用Loader打包样式（下）
css-loader中常用的配置项webpack.config.jsconst path = require('path'); //引入node核心模块module.exports = { mode: 'development',//打包模式(默认) entry: { main: './src/index.js',//从那一个文件开始打包 },...
2019-03-19 16:59:36
219
原创 Webpack：使用Loader打包样式（上）
css-loader作用会分析出几个css文件之间的关系，最终把若干CSS文件合并成一段CSSstyle-loader得到css-loader生成的CSS内容之后，style-loader会把这段内容挂载到页面的head部分webpack.config.jsconst path = require('path'); //引入node核心模块module.exports ...
2019-03-19 15:57:58
206
原创 Webpack：使用Loader打包图片
file-loaderwebpack.config.jsconst path = require('path'); //引入node核心模块module.exports = { mode: 'development',//打包模式(默认) entry: { main: './src/index.js',//从那一个文件开始打包 }, m...
2019-03-19 15:02:06
1603
原创 Webpack：Loader是什么？
概念Loader是打包方案，webpack不能识别非js结尾的模块，告知webpack某些特定文件如何打包。引入file-loader打包图片const path = require('path'); //引入node核心模块module.exports = { mode: 'development',//打包模式(默认) entry: { mai...
2019-03-19 14:33:46
1066
原创 Webpack打包过程中的知识点
打包时输出的提示命令Hash： 本次打包对应的唯一哈希值 Version：本次打包使用的版本 Time：整体打包耗时 Asset：打包出的文件 Size：文件大小 Chunks：有时做复杂打包时，会打包出很很多文件，每一个文件都有自己的id值 Chunk Names：每一个js文件对应的名字。 在webpack.condig.js文件中，entry入口对应的名字是main，所...
2019-03-19 10:42:34
159
fcc维基百科搜索页面 wiki viewer
2018-10-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人