学习了一周的CICD,踩了很多坑,都是泪,特此记录一下整个过程,本次项目产出效果是,git push的时候自动化直接部署到服务器上,以下是整个大致流程:1、本地代码push到gitlab2、gitlab通过webhook通知到jenkins3、jenkins拉取gitlab仓库代码,并执行shell脚本4、shell脚本执行docker命令,打包项目5、安装nginx,并把打包好的dist目录映射
# 如何实现docker修改前端代码 ## 一、流程概述 在使用Docker进行前端开发时,我们需要先将前端代码构建成镜像,然后运行该镜像,最后挂载本地代码到运行的容器中,实现实时修改前端代码的效果。 以下是实现“docker修改前端代码”的具体步骤: ```mermaid journey title Docker修改前端代码流程 section 准备工作 开
原创 2024-04-27 06:17:18
209阅读
Nacos-UI环境版本环境部署1. 权限不足报错2. 项目环境构建启动Console-Ui脱离Console-UIConsole-UI配置       Nacos Console模块与Console-ui没有直接关联关系,Console启动后读取的是Console -> resource下的static静态文件。   
先逼逼一顿我自己需要记住的东西A:目的是一个mysql服务、三个tomcat服务,一个nginx,同时在nginx中部署vue打包后的工程 B:因为本文的重点是nginx,所以有关于mysql、tomcat的dockerfile以及docker-compose.yml文件不会出现在本文中,如果有需要了解,则去看我其他的文章 C.本文会贴出nginx.的配置文件 D:本文重点是作为自己的笔记,so
目录一、安装Jekins二、jekins配置三、构建项目一、安装Jekins        1、安装docker-compose         2、编辑docker-compose.ymlversion: '3.1' services: jenkins: image: jenkins/jenki
# 如何实现Docker部署前端代码 ## 流程图 ```mermaid flowchart TD A(准备前端代码) --> B(创建Dockerfile) B --> C(构建Docker镜像) C --> D(运行Docker容器) ``` ## 步骤表格 | 步骤 | 描述 | | :--: | :-- | | 1 | 准备前端代码 | | 2 | 创建Dock
原创 2024-02-25 06:33:43
35阅读
docker针对于系统工程师或者开发人员来说操作比较简单。一般我们习惯了对着黑黑的屏幕敲命令,docker pull,docker push,docker run,docker logs,docker ps等等。或者我们将常用的docker原生api封装到我们的shell脚本工具或者python脚本工具中去使用管理docker。然而对于部分用户,或者说非技术用户去使用docker难度其实不小。因此
## 前端代码做成Docker容器 ### 什么是Docker容器? 在介绍前端代码如何做成Docker容器之前,我们先来了解一下Docker容器是什么。 Docker是一个开源的容器化平台,它可以将应用程序及其依赖项打包到一个称为容器的独立单元中。每个容器都包含了运行应用程序所需的所有内容,包括代码、运行时、系统工具和依赖项。这使得容器可以在任何环境中运行,而不需要担心环境之间的差异。
原创 2023-09-29 03:22:18
102阅读
动手实践其实动手实践也应该包含在学习方法里,它的意义是如此重要,所以我把动手实践专门划分在一个段落里。上述的主要是理论知识的学习,而我们要认清编程本质上是一门技术,一门手艺(我当然承认编程其实是一门艺术)。一定要能够动手做出实际的东西,写下一行行代码才算你真正掌握。否则你只能拿着书里学到的那些名词术语装装逼而已。在交流群里胡侃半天,结果别人问你造过什么轮子,开发过什么项目你就傻眼了。现在前端岗位招
前端代码发布案例参考 看了两个个知乎的回答, 自己总结下.大公司里怎样开发和部署前端代码?回答一非覆盖发布: 文件的摘要信息放到资源文件发布路径中, 这样内容有修改的文件变成了一个全新的文件, 不会覆盖之前的文件先全量部署静态资源, 再灰度部署页面.大公司里怎样开发和部署前端代码?回答二回答二: 简单情况下的发布方式前提: 前后端发布分离前端渲染, 不考
一、前言既然你进来看这篇文章,我认为“微信小程序反编译”这个技术你多少应该会了解点。在学习微信小程序前端开发的过程中,我跟大部分人一样,试着仿写过一些线上的小程序案例,但在实际练手中,别人的小程序对你来说完全是黑盒的,看到人家上线的小程序的效果,纯靠推测,部分效果在绞尽脑汁后能做出大致的实现,但是有些细节,费劲全力都没能做出来。这个时候就有强烈的愿望想获取别人的源码看看“庐山真面目”。后来在网上知
# 将前端代码打包成 Docker 镜像的指南 在现代开发中,容器化技术已经成为一种流行的部署方式。Docker 是一种流行的容器化技术,能够将应用程序及其依赖打包成一个轻量级的、可移植的镜像。在本文中,我们将探讨如何将前端代码打包成 Docker 镜像,并提供相应的代码示例。 ## 为什么要使用 Docker? 使用 Docker 有多个好处: 1. **一致性**:无论在哪个环境中运行
原创 9月前
153阅读
## 为什么Docker更新前端代码不生效? 在开发过程中,我们通常会使用Docker来构建和部署应用程序。然而,有时候我们会发现更新前端代码后,刷新页面却没有生效。这可能是由于缓存问题导致的。本文将介绍为什么会出现这种情况,以及如何解决这个问题。 ### 为什么更新前端代码不生效? 当我们使用Docker构建应用程序时,Docker会将代码打包成镜像并运行在容器中。容器本身具有缓存机制,有
原创 2024-05-10 04:15:08
530阅读
vue官方文档知识储备es6语法补充let使用 var { var a = 1; } console.info(a); // 1 例1: var arr = []; for (var i = 0; i < 10; i++) { arr[i] = function(){ console.info(i); } } arr[6]()
今天简单的描述一下vue项目基本的环境是如何搭建的,以及一些注意事项。 其实很早有想写这篇文章的想法,但是想着这种问题挺基础的,而且网上也有挺多的教程,不过周围刚接触前端项目的同学经常来问我怎么搭建前端环境,所以想想还是有必要总结一下的。目录结构首先看一下使用vue-cli搭建的基本项目目录结构:如上图,这个项目结构一般是我们开发项目所需要的最基本的结构,各个文件夹的作用也在图中标明。创建完这样的
# 前端代码打包生成Docker镜像的方案 在现代前端开发中,使用Docker进行应用打包已经成为了一种流行的做法。Docker可以让我们轻松管理应用的依赖、环境配置,同时提高开发和部署的效率。本文将详细介绍如何将前端代码打包生成Docker镜像,并提供相应的代码示例和步骤说明。 ## 1. 项目准备 首先,我们需要准备一个简单的前端项目。我们可以使用Vue.js、React或任何其他主流前
原创 9月前
55阅读
目的:  模块化开发,组件化开发,让代码符合开发规范,更高效webpack作用:从pack,就知道这是包的意思,比较专业点叫做前端自动化打包构建工具,代码错误检查,预处理,文件合并(打包),代码压缩,                         将各种文件
P90-前端基础高级布局flex-弹性容器属性介绍 文章目录P90-前端基础高级布局flex-弹性容器属性介绍1.概述2.弹性容器属性介绍2.1.设置弹性元素是否自动换行2.2.设置分配主轴上的空白空间2.3.设置元素在弹性容器辅轴对齐方式2.4.覆盖当前弹性元素上的align-items2.5.设置元素在弹性容器辅轴空白空间的分布3.弹性容器属性设置完整代码 1.概述这篇文章介绍弹性容器盒中弹性
# 前端代码制作 Docker Nginx 镜像 在前端开发中,使用 Docker 和 Nginx 来封装和部署应用程序是一种高效、现代的做法。Docker 允许我们以容器的形式打包应用,保证在任何环境中都能一致地运行。而 Nginx 则是一个高性能的 HTTP 和反向代理服务器,非常适合用来为静态网站提供服务。本文将详细介绍如何将前端代码打包成 Docker Nginx 镜像,并提供相关代码
原创 11月前
40阅读
webpack 的打包发布1. 为什么要打包发布项目开发完成之后,使用 webpack 对项目进行打包发布的主要原因有以下两点:① 开发环境下,打包生成的文件存放于内存中,无法获取到最终打包生成的文件② 开发环境下,打包生成的文件不会进行代码压缩和性能优化为了让项目能够在生产环境中高性能的运行,因此需要对项目进行打包发布。2. 配置 webpack 的打包发布在 package.json 文件的
  • 1
  • 2
  • 3
  • 4
  • 5