/engineering-tools

前端工程化技术及思想学习记录

Primary LanguageJavaScript

engineering-tools

✨ 本仓库将持续更新
前端工程化技术及**学习记录

🚀什么是前端工程化?

前端工程化是一个很大的范围,将开发阶段代码发布到生产环境,可以分为五个部分:开发、构建、部署、性能、规范化

🎨工程化内容

开发 构建 部署 性能 规范化

✨具体涉及到的相关技术和概念

  • 模块化(Modularity):将复杂的前端代码拆分为独立的模块,以便更好地组织、管理和重用代码(npm包管理工具)。
  • 打包(Bundling):将多个模块的代码合并到一个或多个文件中,以减少请求次数,并提升加载性能。
  • 构建(Building):通过预处理、编译、优化等步骤,将源代码转换为可以在浏览器中运行的最终代码。
  • 任务自动化(Task Automation):使用工具(如 Gulp、Grunt、Webpack)自动执行重复性的任务,如编译、打包、压缩、测试等。
  • 静态类型检查(Static Type Checking):使用类型检查工具(如 TypeScript、Flow)来在开发过程中检测潜在的类型错误。
  • 代码质量保证(Code Quality Assurance):使用代码风格检查工具(如 ESLint)和自动化测试工具(如 Jest、Mocha)来确保代码质量和稳定性。
  • 性能优化(Performance Optimization):通过压缩代码、减少网络请求、使用缓存等手段,改善网页的加载速度和性能。
  • 版本控制(Version Control):使用版本控制系统(如 Git)管理代码的版本、协同开发和解决代码冲突。
  • 部署(Deployment):将构建好的代码发布到生产环境中,使网站或应用程序能够在线访问。
  • 自动化部署(Continuous Deployment):通过自动化流程将代码从版本控制系统中的特定分支部署到生产环境,以实现快速迭代和交付。