当前位置: 首页 > news >正文

【Vercel】Vercel静态部署踩坑

背景

在现代的软件开发中,自动化部署是一个不可或缺的环节。Vercel作为一个流行的前端部署平台,提供了与GitHub的无缝集成,使得开发者能够在每次提交代码后自动触发部署流程。然而,自动化部署过程中可能会遇到一些挑战,比如提交Git的邮箱与GitHub绑定的邮箱不一致导致自动部署失败。本文将探讨这一问题及其解决方案,并介绍如何通过自定义域名来提升部署项目的专业度。

Github自动部署问题

vercel默认支持在Github的commit操作后进行自动部署

自动部署失败

问题:如果提交git的邮箱和GitHub绑定邮箱不一致呢?

结果:失败

在这里插入图片描述

失败原因

如何解决

设置本地git提交邮箱

  1. 原本未设置全局邮箱,所以报错
  2. 设置本地Git提交邮箱: 在终端或命令提示符中,使用以下命令来设置你的提交者姓名和邮箱。
git config --global user.name "Your Name"
git config --global user.email "your_email@example.com"
//替换Your Name为你的真实姓名,your_email@example.com为你的GitHub绑定邮箱。 ![](https://img-blog.csdnimg.cn/img_convert/ac659362f91540f9cd31391ab5162e66.png)
  1. 在设置后进行提交,会检测到commit并自动部署

在这里插入图片描述

如下图所示,提示部署成功了!

如何访问

域名

可以自定义域名,也可以使用vercel的子域名

自定义域名需要自己购买,使用vercel的子域名等于是挂载在vercel网站下

![](https://img-blog.csdnimg.cn/img_convert/68e19b9549ded8459207cb78f6c0d147.png在这里插入图片描述

在这里插入图片描述

最后成功

完成上面的内容后,就可以直接点进配置域名进入部署项目的主页了
在这里插入图片描述

【Vercel】如何将你的静态网站发布?(无需服务器完成自动部署)

在这里插入图片描述

命令报错

报错详情

13:18:21.159
13:18:21.160npm error This is an error with npm itself. Please report this error at:
13:18:21.160npm error
13:18:221.16 npm error A complete l
<https://github.com/npm/cl/ssues>
logofthhis run can bbeffound in: /vercel.1/.npm/_1ogs/2024-09-29T05_17_00_500Z-debug-0.1og
13:18:21.285
13:18:21.40213:18:21.287sh: line 1: vite: command not found
Error: Command "vite build" exited with 127

如何解决

先在本地连接测试

  1. 安装vercel依赖
    npm install -g vercel
  2. 登录vercel
    vercel login
    登录会选择代码仓库,这里用的是github,直接跳转浏览器登录
  3. 登录后本地部署连接

    这里的报错和上面相同

解决

考虑是package-lock.json
锁死了版本,导致依赖安装失败
删除package-lock在本地安装,就成功了

然后在vercel平台安装生产环境

【Vercel】如何将你的静态网站发布?(无需服务器完成自动部署)

http://www.lryc.cn/news/463575.html

相关文章:

  • 【Spring】关于Spring中aware相关接口的作用
  • 动态内存管理及RAII的简单应用
  • 7、Vue2(一)
  • Chapter11
  • LLAMA2入门(一)-----预训练
  • 使用poi-tl动态写入目录更新问题解决
  • OpenCV高级图形用户界面(9)更改指定窗口的位置函数moveWindow()的使用
  • 华山论剑之Rust的Trait
  • AI 编译器学习笔记之七五 -- pdb 使用方法
  • 15分钟学Go 第8天:控制结构 - 循环
  • 后端接收参数的几种常用注解
  • 如何使用docker在linux中配置C++环境
  • darknet_ros 使用教程
  • 第九课 Vue中的v-bind指令拓展
  • DOIP协议介绍2-Diagnostic power mode information request (0x4003)消息
  • Eclipse 软件:配置 JDBC、连接 MySQL 数据库、导入 jar 包
  • 二叉树中的最长交错路径
  • 高校企业数据可视化平台功能介绍/特色功能
  • RHCE第三次笔记SSH
  • JAVA基础-包装类
  • 复合逻辑运算与复合逻辑门
  • 工厂模式~
  • Elasticsearch基本使用及介绍
  • 10. PH47代码框架文件组织
  • LabVIEW提高开发效率技巧----VI继承与重载
  • 4.8 大数据发展趋势
  • 【无标题】react组件封装
  • git+cmake将Open3D配置到visual studio
  • ArcGIS-CityEngine 2024-新手小白也能试用+入门可视化vga编程--第一篇
  • IntelliJ IDEA 快捷键大全(也适用全家桶其他编辑器)