记一次组件打包为链接的实践
需求背景 最近要做一个将第三方聊天库打包为链接,以便于顾客端使用,类似于这个样子 , 以实现将代码嵌入到顾客端网站的 标签之前即可完成部署,开发过程中遇到诸多难点 需求难点 打包工具选型 最容易想到的办法就是沿用公司之前的 webpack 框架,这里升级到了 webpack4(见之前的文章 Webpack 配置笔记 ),考虑到打包后可能会包含一些 webpack 的多余代码,因此不是最优方案。但迫于技术的不成熟以及开发时间的压力,还是把 webpack… »
女王控的博客
需求背景 最近要做一个将第三方聊天库打包为链接,以便于顾客端使用,类似于这个样子 , 以实现将代码嵌入到顾客端网站的 标签之前即可完成部署,开发过程中遇到诸多难点 需求难点 打包工具选型 最容易想到的办法就是沿用公司之前的 webpack 框架,这里升级到了 webpack4(见之前的文章 Webpack 配置笔记 ),考虑到打包后可能会包含一些 webpack 的多余代码,因此不是最优方案。但迫于技术的不成熟以及开发时间的压力,还是把 webpack… »
webpack4 配置一览 基于 react-boilerplate 技术栈 antd + react + less 不断更新 前端的发展 模块化 模块化是指把一个复杂的系统分解到多个模块以方便编码。 挂载到变量 jQuery 库把它的 API 都放在了 下,在加载完 jQuery 后其他模块再通过 去使用 jQuery 命名空间冲突,两个库可能会使用同一个名称,例如 Zepto 也被放在 下; 无法合理地管理项目的依赖和版本; 无法方便地控制依赖的加载顺序。 CommonJS… »
本项目的面试题来源于 sudheerj/reactjs-interview-questions 这个项目。一时兴起就动起了翻译的念头,由于本人的 React 功力尚浅,翻译的内容难免有误或不妥的地方,望请各位见谅。如果你喜欢这个项目,请 Star,更感谢你的 Pull Request。 以下是现阶段本项目的短期计划: 完成前期的翻译工作 为 React 16 新特性,添加在线示例或完整的示例代码 这里再次感谢 liaoyongfu 的大力支持 Core React 什么是 React… »
组件实践 组件接口设计三原则 保持接口小,props 数量要少 根据数据边界来划分组件,利用组合(composition) 把 state 尽量往上层组件提取 同时,我们也接触了这样一些最佳实践: 避免 renderXXXX 函数,直接使用独立的纯函数组件 给回调函数类型的 props 加统一前缀,比如 on 或者 handle 使用 propTypes 来定义组件的 props 组件内部实现 尽量每个组件都有自己专属的源代码文件; 用解构赋值(destructuring assignment… »
通用篇 复制与保存 copy 方法 可以通过全局的方法 在 里 任何你能拿到的资源 存储为一个全局变量 如果你在 中打印了一堆数据 (例如你在 App 中计算出来的一个数组),然后你想对这些数据做一些额外的操作比如我们刚刚说的 (在不影响它原来值的情况下)。那就可以将它转换成一个全局变量,只需要右击它,并选择 “Store as global variable” (保存为全局变量) 选项。 第一次使用的话,它会创建一个名为 temp1 的变量,第二次创建 temp… »