前端工程化

qiankun 是一个基于single-spa的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用的微前端架构系统。 关键词 HTML Entry 接入方式：微应用的形态是HTML，接入

目前活动、运营支撑等相关业务部分产品内部的用户标识符大多采用浏览器第三方工具库生成； 兄弟app团队在app内部采用设备ID——deviceId，在app外部采用第三方工具库； 第三方工具库版本

模块热替换(HMR - hot module replacement)功能会在应用程序运行过程中，替换、添加或删除 模块，而无需重新加载整个页面。主要是通过以下几种方式，来显著加快开发速度

Compiler Compiler模块是Webpack的支柱引擎，它继承自Tapable类(可以注册和调用插件)，可以通过CLI或Node API传递的所有参数创建出一个Compiler 实例，调用该

如何借助webpack实现自定义prefetch、preload呢？ 以下方案可供参考： 1、代码分离 webpack v4.6.0+ 增加了对预获取和预加载的支持。 在声明 import 时，使用下

webpack devtool可用来控制是否生成以及如何生成source map。或者使用 SourceMapDevToolPlugin/EvalSourceMapDevToolPlugin 进行更细

保持版本最新，如webpack、node.js、npm或yarn； 将loaders应用于最少数的必要模块中； 尽量少使用不同的工具，每个额外的loader/plugin都有启动时间； 尽量减少

webapck 是现代javaScript应用程序的静态模块打包器。它会在内部从一个或多个入口点出发构建一个依赖关系图，然后将您项目中所需的每个模块组合成一个或多个bundles

tree shaking是一个术语，通常用来描述移除JavaScript上下文中未使用的代码(dead-code)。它依赖于 ES2015 模块系统中的静态结构特性

webpack plugins是一个通过注册webpack自身编译过程中触发的生命周期钩子来实现访问和处理编译过程的javaScript函数或class。插件的使用范围从打包优化、压缩，一直到重新定义

webapck loader 是一种将所有类型的文件，转换为应用程序的依赖图(和最终的bundle)可以直接引用的模块的函数，然后利用webpack的打包能力，对它们进行处理

前端开发同学在拿到接口文档后，往往需要结合接口数据进行开发； 在接口未可用时，前端开发一般通过如下途径进行数据mock： 本地业务逻辑代码掺杂假数据，但具有开发侵入性； 本地项目引入mockjs

团队项目开发时需上传静态资源至OSS时无入口，需要运维手动上传及需要进一步确定文件命名、归属bucket及文件夹等，期间需要替换资源时沟通成本和人力成本则瞬间以倍数增长，而且效率低；

公司内部团队终多，公司层面缺乏组件库及组件开发规范，部分团队独立发布和维护自己的业务组件库，但移动端组件库不存在。 随着业务体量的增加，组件或模块复用场景越来越多，业务组件便是其中之一

CMD、AMD、Commonjs、UMD、IIFE、ESModule等均是前端模块化程序设计的规范，即以功能块为单位进行程序设计实现其求解算法的方法（此方法即为模块化）的规范，目的是降低程序复杂度。

在visual studio code 编辑器中借助jsconfig.json（javaScript项目）或tsconfig.json（typeScript项目）可实现使 编辑器 智能识别路径别名

前端资源缓存策略：分为常规浏览器缓存配置和CDN配置，其中CDN配置依据不同服务商的能力有不同的配置，大致又分为默认缓存配置、定制缓存、去问号缓存、根据响应头不缓存、页面预存取等。

CI/CD是CI/CD/CD的简写，全称为Continuous Integration/Continuous Delivery/Continuous Deployment，即持续集成/持续交付/持续部

babel-plugin-component与babel-plugin-import均是一个babel的模块化导入插件，兼容antd、antd-mobile、lodash、material-ui等。