前端工程化
文章平均质量分 61
webpack eslint cicd
材女的进击
这个作者很懒,什么都没留下…
展开
-
web前端工程化
前端工程化可以分四个方面来说,分为模块化、组件化、规范化和自动化转载 2023-02-27 16:39:38 · 88 阅读 · 0 评论 -
ES Module 和 Commonjs | require和import的区别
CommonJS 加载的是一个对象(即 module.exports 属性),该对象只有在脚本运行完才会生成。若两个文件同时引用一个模块,改变模块内的值时,require引入的模块内的值不会改变,而import引入的模块内的值会改变。require/exports 输出的是一个值的拷贝,import/export 模块输出的是值的引用。require/exports 是运行时动态加载,import/export 是静态编译。导入:const module = require('module')转载 2023-06-27 15:22:23 · 209 阅读 · 0 评论 -
npm install 原理
首先安装的依赖都会存放在根目录的node_modules,默认采用扁平化的方式安装,并且排序规则.bin第一个然后@系列,再然后按照首字母排序abcd等,并且使用的算法是广度优先遍历,在遍历依赖树时,npm会首先处理项目根目录下的依赖,然后逐层处理每个依赖包的依赖,直到所有依赖都被处理完毕。在处理每个依赖时,npm会检查该依赖的版本号是否符合依赖树中其他依赖的版本要求,如果不符合,则会尝试安装适合的版本。安装某个二级模块时,若发现第一层级有相同名称,相同版本的模块,便直接复用那个模块。转载 2023-08-02 16:32:20 · 173 阅读 · 0 评论 -
用 Git submodule 管理子模块
子模块允许你将一个 Git 仓库当作另外一个Git仓库的子目录。这允许你克隆另外一个仓库到你的项目中并且保持你的提交相对独立。添加Submodule添加sass子项目到自己的项目中,使用git命令git submodule add git@xxx.git sass现在你项目里就存在sass文件夹,进入子目录,你可以进行sass子项目的操作,进行commit,pull,pu...原创 2018-11-06 17:36:53 · 2154 阅读 · 0 评论 -
git返回上个版本
会出现不同版本,用于回退使用,最开始前面一长串的就是版本IDgit log --pretty=oneline恢复到历史版本git reset --hard 版本id将修改推到远程服务器git push -f -u origin master原创 2021-06-08 16:25:52 · 291 阅读 · 0 评论 -
ESLint 用户指南
ESLint 用户指南原创 2023-02-28 11:45:17 · 1465 阅读 · 0 评论 -
webpack的构建原理
加载和解析模块:Webpack 会根据模块的类型和配置,使用合适的 loader 加载和解析模块。解析入口文件:Webpack 通过配置文件中的入口文件(entry)来确定构建的入口,Webpack 会从入口文件开始递归地解析依赖关系,将所有依赖的模块都加入到构建过程中。生成输出文件:Webpack 将打包后的代码生成指定的输出文件,可以是单个文件或多个文件。生成依赖图和 Chunk:Webpack 根据模块之间的依赖关系,生成依赖图,并将相互依赖的模块打包成一个 Chunk(代码块)。转载 2023-07-13 10:34:21 · 106 阅读 · 0 评论 -
webpack 快速上手
本文只是简单的搭建webpack,如需深入了解,请移步webpack中文文档。安装:首先创建一个目录,初始化npm,创建package.json文件,然后在本地安装webpack-climkdir webpack-demo && cd webpack-demonpm init -ynpm install webpack webpack-cli --save-dev...原创 2019-06-10 17:04:10 · 125 阅读 · 0 评论 -
webpack中的chunk
希望读过本篇文章,你在看Webpack配置的时候,能在脑中形成Chunk的生成过程。转载 2023-09-01 10:37:30 · 334 阅读 · 0 评论 -
webpack打包的3种hash值详解
结论:当规则为chunkhash时,打包后的hash值会根据入口文件的不用而不一样,当某个入口文件修改后重新打包,会导致本入口文件关联的所有文件的hash值都修改,但是不会影响到其他入口文件的hash值。结论:当规则为contenthash时,每个文件的hash值都是根据自身内容而生成,当某个文件内容修改时,打包后只会修改其本身的hash值,不会影响其他文件的hash值。由于我们预设的是hash,所以我们直接运行打包npm run build,我们看看我们打包后的是什么东西。这里我就抽取精华部分。转载 2023-08-24 17:16:59 · 1754 阅读 · 0 评论 -
前端面试题 -- webpack
前言随着前端的不断发展,现代前端开发的复杂度和规模越来越庞大。工程化的思想催生了很多流行框架的进程,作为现在最流行的前端构建工具--webpack,很多面试、工作场景中都会出现了它的身影。所以对于现在的前端来说,了解并能够使用webpack,无论对个人技能或者职场求职来说,都是一种有力的提升如果文章中有出现纰漏、错误之处,还请看到的小伙伴留言指正,先行谢过以下 ↓1. 对webpack的了解官方文档本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module.转载 2020-08-05 16:10:54 · 1407 阅读 · 0 评论