腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

综合排序丨最热优先丨最新优先

前端工程化

工程化 所谓前段工程自动化就是：由于前端分裂，有人写css代码，有人写scss，有人写es5，有人写es6，那么就需要翻译工具（命令行工具）翻译成ie或其他所有浏览器能运行的代码版本。 ? 什么是前段工程化，就是要从写html，css，js到写自动化，模块化的html，css，js，并且考虑性能优化。自动化举个例子：使用命令行工具实现代码自动化转变。 工程化中自动化的过程例如我们有这样的工程目录。 ? 那么我们需要开一个sass监听scss文件的修改，并转换为css，然后放到dist里。所谓前段工程自动化就是：由于前端分裂，有人写css代码，有人写scss，有人写es5，有人写es6，那么就需要翻译工具（命令行工具）翻译成ie或其他所有浏览器能运行的代码版本。于是前端从nodejs出现之后，开始用一个工具代替这些自动化工具，最开始是Grunt（已过时），然后是Gulp，现在开始被webpack替代，所以这就是我们为什么要学习webpack！

2018-10-31

1.6K0

标签:

前端工程化

小白眼中的前端开发 vs 实际的前端开发小白眼中的前端开发会写 HTML + CSS + JavaScript 就会前端开发需要美化页面样式，就拽一个 bootstrap 过来需要操作 DOM UI 结构、样式、行为）规范化（目录结构的划分、编码规范化、接口规范化、文档规范化、 Git 分支管理）自动化（自动化构建、自动部署、自动化测试）什么是前端工程化 前端工程化指的是：在企业级的前端项目开发中，把前端开发所需的工具、技术、流程、经验等进行规范化、标准化企业中的 Vue 项目和 React 项目，都是基于工程化的方式进行开发的。好处：前端开发自成体系，有一套标准的开发方案和流程。前端工程化的解决方案早期的前端工程化解决方案 grunt（ https://www.gruntjs.net/ ） gulp（ https://www.gulpjs.com.cn/ ）目前主流的前端工程化解决方案

2021-08-24

5360

标签:

前端工程化浅谈

但现在的前端开发，早就进入了工程化开发的时代，已经存在有各种现代化的框架，编译工具以及预处理器等等。下面就传统和工程化的前端开发优劣介绍下：传统开发：没有采用工程化工具和流程的情况下进行开发，通常需要开发者手动管理文件、依赖和构建过程。组件化，效率高 2、代码质量提升 3、自动化工具和流程 4、按需导入导出等等劣势： 1、入门稍慢 2、灵活性不如传统开发 3、复杂度较高这只是简单的介绍，其实有更多的知识点在这里面，更多的是因为工程化开发是现代前端开发的必备项了为什么说要掌握主流框架是必备，因为前端框架就是前端工程化开发中不可或缺的一部分。框架肯定是利用了现有行业中优势技术，也能避免大家不断重复造轮子，降低上手难度，提升开发效率。还有一个原因就是市场上对于vue技术栈的需求量是比较大的，还有就是vue框架据前辈经验，上手门槛相比于其他框架更低些，只要掌握HTML、CSS、Js就可以上手，所以从vue开始学习和入门前端工程化是合适的

2023-10-30

6060

标签:

前端工程化

前端工程化建设

随着浏览器和前端技术的发展，现在的前端项目越来越大、业务也越来越复杂，前端工程化已经成为一件势在必行的事情。前端工程化其实就是软件工程在前端方向上的实施，不过篇幅有限，本文只讲解其中的几个点。团队规范如果前端团队只有一两个人，规范的作用微乎其微；但团队人数超过一定数量时，规范的作用就显现出来了。百度前端代码规范 Airbnb 翻译版如何编写高质量代码 UI 规范 UI 规范需要前端、UI、产品沟通，互相商量，最后制定下来，建议使用统一的 UI 组件库。推荐阅读：高性能网站建设指南高性能网站建设进阶指南 Web性能权威指南测试测试是前端工程化建设必不可少的一部分，它的作用就是找出 bug，越早发现 bug，所需要付出的成本就越低。监控是前端工程化建设中的最后一环，当项目上线后，通过监控系统可以了解到项目在生产环境中的运行情况，开发团队可以根据监控报告对项目做进一步的调整和优化。

2020-09-28

1K0

标签:

腾讯云测试服务

自动化测试

前端工程化 - 笔记

主要是前端工程化理论 # 前端工程化理论 ---- # 定义前端工程化 = 软件工程 + 前端是⼀种通过规范化、模块化、⾃动化等⼿段，提⾼前端项⽬在研发、运维阶段的效率、质量。

2023-03-16

4410

标签:

前端工程化

浅析前端工程化

什么是前端工程化 自有前端工程师这个称谓以来，前端的发展可谓是日新月异。相比较已经非常成熟的其他领域，前端虽是后起之秀，但其野蛮生长是其他领域不能比的。前端的工程化问题与传统的软件工程虽然有所不同，但是面临的问题是一样的。我们首先回顾一下传统的软件开发流程模型： ? 上图中的运行和维护并不是串行关系，也并非绝对的并行关系。具体到前端工程化，面临的问题是如何提高编码->测试->维护阶段的生产效率。前端工程化面临的问题要解决前端工程化的问题，可以从两个角度入手：开发和部署。从开发角度，要解决的问题包括：提高开发生产效率；降低维护难度。本文不探讨build、compile、make的深层运行机制，下文所述的前段工程化中构建&编译阶段简称为构建阶段。

2018-01-30

1.5K0

标签:

前端工程化-构建

简单说，构建就是把前端工程师开发的源代码进行编译、压缩、打包等一系列操作，最终产出可以直接上线或者可供后端工程师的资源。构建可以划分为纯前端构建和前后端协作构建。所谓纯前端构建，就是说不涉及后端模板的构建，经过构建之后的前端代码可以直接上线。我们在浅析前端工程化一文中提到的便是前后端协作的构建模式，也是本文将要讨论的方向。下面我们细化资源管理的每个关键点，共同探讨一下前端工程中构建环节的工作内容和面临的问题。 1. 但是前端构建工具必须谨慎处理模板引擎的语法，以免造成“误伤”。后端模板引擎多种多样，前端构建工具很难做到百分百覆盖。模板交由后端构建的优点是可以对每种模板引擎有针对性的处理，而且是很工程化的构建方式；缺点是需要额外书写寻址function，但是这个缺点相对于优点来说微不足道。

2018-01-30

1.6K0

标签:

谈前端工程化

开篇语：抖音前端团队通过几年的实践，积累了一些前端研发中的经验与理念，计划通过比较轻松、简洁的语言记录下来分享给大家，希望对大家有帮助，有理解不妥的不吝赐教。作为前端架构的一部分，工程化是个永恒的话题，我们之所以老生常谈这个事情，核心原因在于浏览器这个环境所支持的三种语言没有在语言层面提供统一的模块化支持，这使得大家都在考虑如何添加这些模块特性，更好的支持好开发它们包含了 HTML、CSS、JS，我们通过工程化的手段来达到组件的工程化支持。现在的浏览器已经逐步支持 Web Component 来逐步磨平这些个不足。所以我们的工程化体系里面有了打包(package)这个名词，这个名词几乎是我们工程化体系中无法抹去的一个话题，也同样是性能优化体系里面一个非常重要的手段。同样在前端的组件化体系中也同样有这样的问题。解决依赖是个非常麻烦的事情，一般我们会在构建编译的阶段去搞定这个事情，如果静态编译想搞定这个事情需要有一套可识别的标志。

2021-10-19

7070

标签:

AST 与前端工程化实战AST 与前端工程化实战

本文将通过 AST 与前端工程化的实战向大家展示 AST 的强大以及重要性。直播分享视频地址：AST 与前端工程化实战一、初识 AST 1、demo-1 第一次看见 AST 这个概念的时候还是在《你不知道的 JavaScript》一书中看到的。三、前端工程化 现在，咱来聊聊前端工程化。前段工程化可以分成四个块来说，分别为模块化：将一个文件拆分成多个相互依赖的文件，最后进行统一的打包和加载，这样能够很好的保证高效的多人协作。而这些前端自动化其中的一部分，前端自动化还包含了持续集成、自动化测试等方方面面。而，处于其中任何一个块都属于前端工程化。 AST 又能为前端工程化做些什么？如果觉得文章不错，那么希望你能动动你的小手，帮忙点个赞，谢谢了 ~ 前端交流群：731175396

2020-03-03

1.9K0

标签:

前端工程化概述，带你全面深刻了解前端工程化思想

1 前言大家好，今天我来和大家一起来了解前端工程化的知识，如有疑问和错误，欢迎指正，一起交流探讨哈！ 2 什么是前端工程化？ 3 前端为什么需要工程化？随者前端的快速发展，现在的前端”太大，太广“，”复杂“，"大前端"，"微前端"等词的出现，前端已经不再止于前端了更有甚者，可以说前端不再是后端的附属品了，可以说，前端已经愈加成熟 4 前端工程化要解决哪些问题 4.4 提高项目的开发质量在以上情况的实现下，项目的开发质量必然得到保证 5 前端工程化发展的四个阶段我个人看来前端工程化包括如下阶段: 第一阶段:库/框架选型前端的库和框架大致有（jquery 6 前端工程化的深究前端工程化是对模块化，组件化，规范化，自动化的高度概括和总结凝练，是一个更高层次的思想，也就是说实现前端工程化应该从模块化，组件化，规范化，自动化四个方面着手前端模块化在工程化的基础上

2021-02-23

7800

标签:

腾讯云测试服务