前端笔记之前端工程化

前端工程化的含义及目标

前端工程化 是将软件工程的系统化方法引入前端开发，通过工具、规范和流程的标准化，来解决以下问题：

开发效率：减少重复劳动，提升代码复用性。
代码质量：通过规范、静态检查和测试保障代码可靠性。
协作流程：统一团队编码风格、构建流程和部署规范。
性能优化：自动化资源压缩、按需加载、缓存策略等。
可维护性：模块化、组件化设计，降低维护成本。

前端工程化的核心模块

模块化开发

将代码拆分为独立模块，解决全局作用域污染、依赖管理等问题。

JavaScript 模块化：

ES Modules (ESM)：浏览器原生支持的 import/export。
CommonJS：Node.js 的 require/module.exports。
AMD/UMD：适用于浏览器异步加载（如 RequireJS）。

CSS 模块化：

CSS-in-JS：Styled-components、Emotion。
CSS Modules：通过构建工具生成局部作用域类名。

预处理器：

Sass、Less、PostCSS。

资源模块化：

图片、字体等通过 Webpack 的 file-loader 或 url-loader 处理。

<