3k 字 3 分钟

Jenkins： 是一个持续集成和持续交付（CI/CD）工具，用于自动化构建、测试和部署软件。Jenkins 通过插件支持各种版本控制系统和构建工具。 Jenkins 官网 # 安装与使用 # 环境准备 # 安装 Java 环境（必要环境） sudo apt updatesudo apt install fontconfig openjdk-17-jrejava -version 结果如下即环境安装成功 openjdk version "17.0.9" 2023-10-17<br/> OpenJDK Runtime...
12k 字 11 分钟

本文包含 Nginx 部署 Web 应用、Docker 部署 Web 应用、Jenkins 、CI/CD 部署 Web 应用 等内容。快速使用也可以。深入了解 需要了解 NodeJs 知识：NodeJs 环境配置。 需要了解 Docker 知识：Docker 相关知识。 需要了解 Jenkins 知识：Jenkins 相关知识。 注意：此处部署是在 Ubuntu 操作系统中进行。如果安装慢，可以修改一下镜像源。 目前主流框架的渲染方式有: SPA 客户端渲染；SSR 服务端渲染 # 知识梳理 nginx 中 location 后面的值最后增加 / 和 proxy_pass 值后面携带 /...
7.5k 字 7 分钟

Docker： 是一种容器化平台，用于创建、部署和运行应用程序。Docker 允许将应用程序和其依赖项打包到容器中，使其在不同环境中具有一致的运行方式。 腾讯云镜像 阿里云镜像 Docker 文档 # 安装与使用 # Linux (Ubuntu server) 安装 Docker 这里安装的是 Docker Engine，不是 Docker Desktop。 # 卸载所有与 Docker Engine 可能有冲突的包 for pkg in docker.io docker-doc docker-compose docker-compose-v2 podman-docker...
7.9k 字 7 分钟

Git Hooks，根据 husky 、 lint-staged 、 imagemin-lint-staged 、 prettier 、 pretty-quick 、 ESlint 、 stylelint 、 commitlint 、 cz-customizable 、 commitlint-config-cz 、 commitlint-config-git-commit-emoji 、 依赖进行构建。 # 什么是 Git Hooks Git 钩子（Git Hooks）是一种在 Git 事件发生时触发自定义脚本的机制。这允许开发者在特定的 Git...
2.3k 字 2 分钟

# 经典整体 let、const、var 的区别？什么是块级作用域？如何使用？ 答案如下。 # 声明变量关键字 在 JavaScript 中有 3 中声明变量的方式： var let const 最初声明变量的关键字就是 var ，但是为了解决作用域问题，所以新增了 let 和 const 的声明方式。 # 什么是作用域 ES5 中的作用域有：全局作用域、函数作用域。 ES6 中新增了块级作用域，块级作用域有 {} 包括， if语句 和 for语句 里面的 {} 也属于块级作用域。 更多内容在...
3.7k 字 3 分钟

# 异步路由 vue-router 的路由配置 () => import("vue路径");:q # UI 框架按需引入 根据 UI 框架的提示，在项目中（Vue， React）按需引入 # 压缩静态资源 图片压缩 vite 中的图片压缩工具有（具体配置查看以下链接）： vite-plugin-compress vite-plugin-imagemin 小图片转化 base64 vite 中的配置 export default defineConfig(({ command, mode }) =>...
23k 字 21 分钟

本文章不适合 CSS 初学者，因为没有具体写案例，本文更偏向理论。对于有一定开发经验的人员来说，这篇文章就是探究 CSS 的究竟等问题。也就是对 CSS 的问题进行刨根问底。 # CSS 单位总结 # 经典真题 px 和 em 的区别？ px 即 pixel 像素，是相对于屏幕分辨率而言的，是一个绝对单位，但是具有一定的相对性。因为在同一设备上每个设备像素所代表的物理长度是固定不变的 (绝对性)，但在不同设备间每个设备像素所代表的物理长度是可以变化的 (相对性)。 em 是相对长度单位，具体的大小要相对于父元素来计算，例如父元素的字体大小为 40px，那么子元素 1em...
450 字 1 分钟

# 经典真题 什么是可替换元素，什么是非可替换元素，他们各自有什么特点？ 可替换元素是指一种元素，在页面大部分展现的效果不由 CSS 决定； 比如: img, audio, video, iframe 等。 非可替换元素是指普通元素，在页面上完全由 CSS 决定； 比如: p, h1~h6。 # 什么是可替换元素 所谓可替换元素 (replaced element)，是指一些展现效果不由 CSS 来控制的元素。这些元素是一种外部对象，它们外观的渲染，是独立于 CSS 的。 可替换元素 MDN # 常见的替换元素 图片标签 img, 图片展示的内容和效果是图片内部的，不受 CSS...
1k 字 1 分钟

# 经典真题 什么是微格式？前端构建中应该如何考虑微格式？ 所谓微格式，是建立在已有的、被广泛采用的标准基础之上的一组简单的、开放的数据格式。 具体表现是把语义嵌入到 HTML 中，以便有助于分离式开发，并通过制定一些简单的约定，来兼顾 HTML 文档的人机可读性，相当于对 Web 网页进行了语义注解。 采用微格式的 Web 页面，在 HTML 文档中给一些标签增加一些属性，这些属性对信息的语义结构进行注解有助于处理 HTML 文档的软件，更好的理解该 HTML...
723 字 1 分钟

# 经典真题 iframe 用来干什么的？iframe 框架有那些优缺点？ iframe 也称作嵌入式框架，嵌入式框架和框架网页类似，它可以把一个网页的框架和内容嵌入在现有的网页中。 优点: 方便制作导航栏 重载页面时不需要重载整个页面，只需要重载页面中的一个框架页（减少了数据的传输，增加了网页下载速度）。 缺点: 会产生很多页面，不容易管理 调用外部页面，需要额外配置调用 CSS，给页面带来额外的请求次数 会阻塞页面的加载速度，window 的 onload 事件要在 iframe 加载完毕后触发。 浏览器后退按钮无效 无法被一些搜索引擎找到 多数小型的移动设备（PDA...