
前端工程化
文章平均质量分 97
VillanelleS
勤勤恳恳小码农一枚~
展开
-
前端工程化之自动化部署
代码中创建 .github/workflows/deploy.yaml, .github/workflows/test.yaml文件,上传到github后,系统会自动触发部署,从而自动增加 gh-pages 分支,分支下相对应的文件 和 本地执行“pnpm run build”生成的 build/dist 文件下的内容一致。需要对权限进行授权,对仓库的读,写权限,创建文件权限等设置,对仓库进行授权后,才能对当前仓库进行干预,有些工作流会去写些目录到当前工作当中,不会让其他人擅自对仓库内容篡改。原创 2025-04-20 15:24:11 · 1098 阅读 · 0 评论 -
前端工程化之自动化测试
提示:自动化测试:写基础包的一定要进行自动化测试,为了让使用者使用的更放心,使用开源包也是看是否有自动化测试,还要看测试覆盖范围是否是比较齐全的,小厂的话不太关注,中大厂的话使用第三方的包是非常关注自动化测试的。原创 2025-04-19 16:29:30 · 838 阅读 · 0 评论 -
前端工程化之自动化构建
一般上半年行情比下半年行情好,这几年没有前几年行情好,一面的面试官很可能是你的同事,面试的时候不要有情绪,一上来就给hard难度,是不想要你,但是一开始是简单的,后来给hard难度的,证明面试官看好你。可以理解为搞翻译的,webpack不认识的语言,都可以编写对应的loader帮助webpack翻译成AST的,通过AST做各种各样的转换。追踪:发布流程的追踪,用户的追踪。持续的改进和迭代:不是一成不变的,是不停的根据开发的情况,系统整体的变更情况,生产环境的情况等不断变化。原创 2025-04-15 00:16:04 · 1200 阅读 · 0 评论 -
前端工程化之新晋打包工具
在工程当中,打印当前工程版本号//控制台打印当前工程版本号return {},console.log('当前工程版本号:1.0.0')},${import path from 'path' import fs from 'fs' //控制台打印当前工程版本号 export default function myVitePlugin() {console . log('当前工程版本号:1.0.0') } , transform(code , id) {原创 2025-04-12 19:25:23 · 820 阅读 · 0 评论 -
前端工程化之模块化开发 & webpack
常用的构建工具:webpack,vite,rollup,esbuild,rspack初始化参数运行一个脚本传入相关参数,给到 webpack.config.js 文件当中,最终创建 webpack 实例化,会初始化参数,初始化参数后,会进行,将当前脚本的参数和webpack参数进行合并,得出开始编译通过上一步得到的 options,触发 Compiler 实例,new Compiler(options),进行,相当于调用插件的 apply 方法,添加对某些事件的监听执行Compiler的 run 方原创 2025-04-05 01:21:10 · 1222 阅读 · 0 评论 -
前端工程化之前端工程化详解 & 包管理工具
前端工程化 = 前端 + 软件工程软件工程:系统和软件工程层面上的方法、规范,技术手段提升开发的效率,软件工程来自于实体行业类似建筑行业的方法论,将建筑行业的方法论运用到软件领域上,软件领域的相关方法论又延伸到前端上前端工程化 = 将工程化的方法系统化应用到前端开发中Clean Code 代码整洁指导基于业务诉求 => 产出架构设计 又快又好又稳 <= 系统 演进 可量化的方法。原创 2025-03-15 18:15:51 · 1018 阅读 · 0 评论 -
前端工程化之前端进阶之AST
compiler - 编译器将一种代码,转换为另外一种代码输入代码,也可以叫 源代码目标代码(浏览器识别代码):js / cssts / vue / jsx / tsx / coffeescript(JS基础上,JS超集) -> jseslint / tslint 语法检查首先要先将源代码变成可识别的代码对浏览器无法识别的代码,进行转换 -> es5很多支持 es6,但是不会转 es6,因为es5更安全,具备更大的兼容性。原创 2025-03-06 08:45:18 · 1034 阅读 · 0 评论