所以，mta 组件中设置了 "autoReport": true 会导致数据不上报（"autoReport": false 配置不受影响，因为不需要重写 Page）

IOS 浏览器页面布局错位（如：点不到）的分析与解决 IOS 浏览器软键盘的拉起与收缩、微信 IOS 浏览器底部导航条的显示与隐藏，很容易导致页面布局错位（相对窗体的绝对定位元素）： 明明按钮在这里，却要在上面一点儿点击屏幕才能点到它 明明弹框是居中显示的，却向上偏移了很多，导致下面很多空白 明明是固定浮动在某个...

就前端而言，ES6 的模块化写法已经是主流了，但很多老的项目都是用 AMD 或者 CommonJs 规范写的。由于 Webpack 现在已经慢慢不太支持 AMD 或者 CommonJs 规范的代码，所以需要把这两种规范的代码都转换成 ES6 规范的代码。网上搜了一下，并没有这之类的工具，我就自己写了一个：conv-mod.

再谈前端项目的组件化 之前详细聊过的前端项目的组件化，可以参考 组件化 与 私有 npm 仓库，今天来更进一步的说说前端项目的组件化。 1. 之前的组件化 目录结构： {代码...} project1 的 package.json： {代码...} 在代码中使用： {代码...} 2. 之前的组件化方式存在的问题 更新组件比较麻烦，特别是对于一些与业务耦合...

js 函数参数推荐书写方式 ({ param1, param2, ... }) 编程语言函数（包括对象的方法）参数的取值方式大致可以分为两种：按序取值与按名取值。 一般编程语言都是按序取值，比如 C、Java、JavaScript 等，少数语言支持按名取值，比如 Groovy。 1. 按序取值 按照顺序，挨个取值，每个参数的顺序是固定的。 {代码...} 2. 按...

现在，前后端分离与客户端渲染已经成为前端开发的主流模式，绝大部分的前端应用都适合用这种方式来开发，又特别是 React、Vue 等组件技术的发展，更是使这种方式深入人心。

最近接手一个别人的页面，代码很是凌乱与庞杂，当我在增加功能时，发现我添加的模块与原有的模块有冲突，但不知道那个原有的模块在什么位置，就得到处找。

自己常用的前端项目脚手架模板 react-app-starter：React 应用项目模板 react-ts-app-starter：React + TypeScript 应用项目模板 vue-app-starter：Vue 应用项目模板 react-lib-starter：React 组件库项目模板 react-ts-lib-starter：React + TypeScript 组件库项目模板 vue-lib-starter：Vue 组件库项目模板 js-lib-sta...

前端项目如何管理 前端项目的管理分为两个维度：项目内的管理与多项目之间的管理。 1. 项目内的管理 在一个项目内，当有多个开发者一起协作开发时，或者功能越来越多、项目越来越庞大时，保证项目井然有序的进行是相当重要的。 一般会从下面几点来考证一个项目是否管理得很好： 可扩展性：能够很方便、清晰的扩展一个页...

现在，大部分项目都是用 git 来管理代码的，但当项目变大、多人协作时，git 的使用就变得复杂了，这时就需要在 git 使用的流程上来思考如何更优的使用 git。

web 应用常见安全漏洞一览 1. SQL 注入 SQL 注入就是通过给 web 应用接口传入一些特殊字符，达到欺骗服务器执行恶意的 SQL 命令。 SQL 注入漏洞属于后端的范畴，但前端也可做体验上的优化。 原因 当使用外部不可信任的数据作为参数进行数据库的增、删、改、查时，如果未对外部数据进行过滤，就会产生 SQL 注入漏洞。 比...

现在，Web 应用的前后端分离事实上已经成为了大家都认可的一种开发方式，前后端分离之后，前端与后端都用接口（api）来沟通，这就需要我们做好 API 接口管理，所以，这次来聊聊 API 接口管理工具。

前端开发如何做好本地接口模拟 之前有写过一篇 本地化接口模拟、前后端并行开发，讲到过本地接口模拟，但不太细致。这次细细的说说本地接口模拟。 1. 有什么好处 本地接口模拟最大的好处就是能够使前后端项目解耦，前端更专注于开发，减少线上调试，以此提升开发效率。 2. 有哪些途径 本地接口模拟一般分为工具层面和代...

gitlab 安装、配置 对于企业级的私有 git 仓库，gitlab 是个不错的选择。 今天就来说说 gitlab 的安装、配置。 系统配置建议：最低双核 4G 内存。 当前针对 gitlab 版本：11.5.3。 1. 说明 根据官方的安装教程，选取 ubuntu 环境下的社区版进行安装：[链接]。 如果需要其他的环境（如 CentOS、docker 等）或者企业版，参...

js 中的 number 为何很怪异 声明：需要读者对二进制有一定的了解 对于 JavaScript 开发者来说，或多或少都遇到过 js 在处理数字上的奇怪现象，比如： {代码...} 如果想要弄明白为什么会出现这些奇怪现象，首先要弄清楚 JavaScript 是怎样编码数字的。 1. JavaScript 是怎样编码数字的 JavaScript 中的数字，不管是整数、...

vue 前端项目技术选型、开发工具、周边生态 声明：这不是一篇介绍 Vue 基础知识的文章，需要熟悉 Vue 相关知识 主架构：vue, vue-router, vuex UI 框架：element ui, iview, vuetify, vux, mint-ui, vue-material, muse-ui, vant, bootstrap-vue 服务器端渲染：nuxt.js 开发工具：storybook, vue-devtools, vue-loader ...

react 前端项目技术选型、开发工具、周边生态 声明：这不是一篇介绍 React 基础知识的文章，需要熟悉 React 相关知识 主架构：react, react-router, redux, redux-thunk, redux-saga, react-redux, dva, umi 扩展架构：styled-components, recompose, react-loadable UI 框架：ant-design, ant-design-mobile, material-...

最新版的 node 支持最新版 ECMAScript 几乎所有特性，但有一个特性却一直到现在都还没有支持，那就是从 ES2015 开始定义的模块化机制。而现在我们很多项目都是用 es6 的模块化规范来写代码的，包括 node 项目，所以，node 不能运行 es6 模块文件就会很不便。

现在，基本上前端的项目打包都会用上 webpack，因为 webpack 提供了无与伦比强大的功能和生态。但在创建一个项目的时候，总是免不了要配置 webpack，很是麻烦。

选择一个现成项目模板是搭建一个项目最快的方式，模板已经把基本的骨架都搭建好了，你只需要向里面填充具体的业务代码，就可以通过内置的工具与命令构建代码、部署到服务器等。

从 1 到完美，写一个 js 库、node 库、前端组件库 之前讲了很多关于项目工程化、前端架构、前端构建等方面的技术，这次说说怎么写一个完美的第三方库。 1. 选择合适的规范来写代码 js 模块化的发展大致有这样一个过程 iife => commonjs/amd => es6，而在这几个规范中： iife: js 原生支持，但一般不会直接使用这种...

细说 js 压缩、sourcemap、通过 sourcemap 查找原始报错信息 1. js 压缩 js 压缩对前端开发者来说是一门必修课。 一般来说，压缩 js 主要出于以下两个目的： 减小代码体积，加快前端资源加载速度 保护源代码不被别人获取 压缩 js 使用的工具库： UglifyJS2: 压缩 es5 uglify-es: 压缩 es6+ closure-compiler、closure-co...

从本质上来说，html/js/css/md ... 源代码文件都是文本文件，文本文件的内容都是字符串，对文本文件的操作其实就是对字符串的操作。

除非在一些不得不使用服务器端渲染的情况下（如门户、电商等），应当尽量使用客户端渲染，因为客户端渲染更能使前后端分离（项目分离、代码解耦、协作分离、职责分离等），也能更好的做本地接口模拟开发，提升开发效率。

如何提升前端性能和响应速度 下面大多是从前端工程化的角度给出的优化建议，如果需要了解语法上的优化，可以参考： 如何提高页面加载速度 编写高效的JavaScript Web前端性能优化进阶 - 完结篇 1. 原生 css 动画代替 js 动画 原生 css 动画要比 js 实现的动画要高效很多，所以在可能的情况下尽量用原生 css 动画。 可以参...

现在移动端 web 应用，很多时候都需要与原生 app 进行交互、沟通（运行在 webview 中），比如微信的 jssdk，通过 window.wx 对象调用一些原生 app 的功能。所以，这次就来捋一捋 h5 与原生 app 交互的原理。

前端与后端最初的渲染方式是后端模板渲染，就是由后端使用模板引擎渲染好 html 后，返回给前端，前端再用 js 去操作 dom 或者渲染其他动态的部分。

如何构建大型的前端项目 1. 搭建好项目的脚手架 一般新开发一个项目时，我们会首先搭建好一个脚手架，然后才会开始写代码。一般脚手架都应当有以下的几个功能： 自动化构建代码，比如打包、压缩、上传等功能 本地开发与调试，并有热替换与热加载等功能 本地接口数据模拟 css 模块化 检查并自动矫正不符合规范的代码，并...

对 node 项目而言，模块导出入口文件由 package.json 的 main 字段指定，而如果是要安装到命令行的工具，则是由 package.json 的 bin 字段指定。

github 上有趣又实用的前端项目（持续更新，欢迎补充） 1. reveal.js: 幻灯片展示框架 一个专门用来做 HTML 幻灯片的框架，支持 HTML 和 Markdown 语法。 github: [链接] demo: [链接] 动图取自博客 reveal.js - 程序员的PPT制作神器。 2. impress.js: 又一个幻灯片展示框架 一个受 [链接] 的启发，使用了现代浏览器里支...