摘要：
CSS px to rem 分辨率不同 浏览器的分辨率都是不一样的 过去 在过去，我们都是靠媒体查询来实现响应式布局 这里有个缺陷，就是需要写多套匹配样式的代码 @media screen and (max-width: 980px) { .header { width: 900px; } } @m 阅读全文
摘要：
webpack 自动补齐 CSS 样式 autoprefixer 自动补齐 CSS3 前缀 CSS3 的属性为什么需要前缀？ 浏览器标准不统一，目前来看。 举个例子 .box { -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-bo 阅读全文
摘要：
自动清理构建目录产物 当前构建时的问题 每次构建的时候都不会清理目录，造成构建的输出目录 output 文件越来越多 rm -rf ./dist && webpack rimraf ./dist && webpack 方法有点笨 自动清理构建目录 避免构建前每次需要手动删除 dist npm ins 阅读全文
摘要：
HTML CSS 和 JS 的代码压缩 1. HTML 压缩 html-webpack-plugin，这是一个非常强大的插件 安装 npm install html-webpack-plugin -D 修改 html-webpack-plugin，然后设置压缩参数 "use strict"; // 阅读全文
摘要：
文件指纹 什么是文件指纹？ 文件指纹指的是打包后输出的文件名的后缀。 文件指纹如何生成？ Hash：和整个项目的构建相关，只要项目文件有修改，整个项目构建的 hash 值就会更改。 Chunkhash：和 webpack 打包的 chunk 有关，不同的 entry 会生成不同的 chunkhash 阅读全文
摘要：
1. webpack中的文件监听 文件监听是在发现源码发生变化时，自动重新构建出新的输出文件。 webpack 开启监听模式，有两种方法： 启动 webpack 命令时，带上--watch 参数 在配置 webpack.config.js 中设置 watch：true { "name": "hell 阅读全文
摘要：
资源解析 解析 ES6 使用 babel-loader 在项目根目录下安装 babel npm install -D babel-loader @babel/core @babel/preset-env webpack # 我用 npm 没装上 尝试了很多次 # 最后直接用 yarn add 装的 阅读全文
摘要：
webpack 核心概念 1. Entry Entry 介绍 Entry 用来指定 webpack 的打包入口 模块打包器 依赖图的入口是 entry 对于非代码来说，比如图片、字体依赖也会不断的加入到依赖图里面。 然后在 webpack 处理以后，就没有依赖了，全部弄成静态的资源。 Entry 的 阅读全文
摘要：
1. 为什么需要 webpack 等构建工具？ 转换 ES6 语法 转换 JSX CSS 前缀补全、预处理器 压缩混淆 图片压缩 2. 前端构建演变之路 ant + YUI Tool ⇒ grunt ⇒ fis3 | gulp ⇒ rollup | webpack | parcel 代码混淆曾经是通 阅读全文
摘要：
SICP exercise-1.1 Below is a sequence of expressions. What is the result printed by the interpreter in response to each expression? Assume that the se 阅读全文
摘要：
SICP exercise-1.1 Below is a sequence of expressions. What is the result printed by the interpreter in response to each expression? Assume that the se 阅读全文
摘要：
Linux文件系统 文件系统的类型 普通文件 如文本文件、C语言元代码、SHELL脚本、二进制的可执行文件等，可用cat、less、more、vi、emacs来察看内容，用mv来改名。 目录文件 包括文件名、子目录名及其指针。它是LINUX储存文件名的唯一地方，可用ls列出目录文件。 连接文件 是指 阅读全文
摘要：
there are techniques for controlling the complexity of these large systems. 控制复杂度是《代码大全》里面反复强调的技术 First technique, which is used in all of engineering 阅读全文
摘要：
提供给 diff 算法，性能优化，防止 bug 不要用 index 了兄弟们 export function uuid() { var i, random; var uuid = ''; for (i = 0; i < 32; i++) { random = Math.random() * 16 | 阅读全文
摘要：
VIM 文本对象选择的快捷键值得好好练一下，每天拿出来看看，直到成为肌肉记忆。因为，非常好用。 假设有下面的文本内容： if (message == "sesame open") 我们进一步假设光标停在“sesame”的“a”上，那么： dw（理解为 delete word）会删除 ame␣，结果是 阅读全文
摘要：
其实我是不喜欢写分号的，好不容易能不写分号，像 python 一样，多爽。 几年前，各种各样的书大致上都推荐你加分号。 几年前，曾经由于构建工具有一些问题，导致不加分号可能会出问题。 jquery依然留着分号，vue源码不用分号, react源码规范需要分号。 不过，最关键的，还是看团队的代码风格。 阅读全文
摘要：
原文 https://github.com/linxiaowu66/nodejs-useful-packages#%E5%89%8D%E8%A8%80 前言 1、日志 pino: 性能极好的nodejs日志器。它还包括一个shell界面以更好地打印它的日志文件 winston: 一款多传送异步日志库 阅读全文
摘要：
所有的 web api，供以后查阅使用 获取 web api 的代码 <script> let names = Object.getOwnPropertyNames(window); function filterOut(names, props) { let set = new Set(); pr 阅读全文
摘要：
今天学到了一个新的技巧，用鼠标点击 chrome dev tools 的 Elements 中的标签以后 ，使用 $0 就可以获取到鼠标所点击的 DOM 节点 然后总结一下 Dom Scroll 的 api。 常用的就是这几个。 $0.scrollBy(30, 30); $0.scrollTo(0, 阅读全文
摘要：
虽然放在 DOM 分类里面，但是 CSS OM 并不属于 DOM，而是并行的。仅为方便查找。 document.styleSheets <style title="hello"> a { color: red; } </style> <link rel="stylesheet" title="x" 阅读全文