【前端】Vite打包页面简单部署到GitHub上

最新推荐文章于 2024-07-18 23:17:29 发布
最新推荐文章于 2024-07-18 23:17:29 发布
阅读量635 收藏 5
点赞数 10
分类专栏： 前端 文章标签： 前端 github
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44055864/article/details/136485109
版权

创建仓库---->上传代码---->设置
在这里插入图片描述

注意点已经打上箭头,代码我传到的是test分支
在这里插入图片描述
vite打包的配置如图，base是仓库名称，docs是build后生成的打包目录。
上传到GitHub就自动部署了
访问就是第一张图里的一串地址，这种方式比较方便吧

Vue3+Vite开发的项目进行加密打包
一起学习
04-27 1538
本文主要介绍Vue3+Vite开发的项目如何进行加密打包。
04.使用 github actions+docker 自动部署前后端分离项目 zhontai (.net core+vue)
我不懂，可我不傻
07-18 884
Github Actions是什么？是 GitHub 提供的一种持续集成/持续部署（CI/CD）工作流程自动化服务,助力项目的自动化构建、测试和部署。依托于平台，本文将分享使用 GitHub Actions 完成对一个.Net Core+Vue 的前后端分离项目 zhontai 的构建，并使用 docker 部署到云服务器(阿里云)
VitePress 构建的博客如何部署到 github 平台？
guoqkmiss的博客
04-28 1098
由于我们的项目名称为 ，所以我们把 设置为 ，需注意前后 2.2. 页面显示异常 这个时候你发现本地页面显示异常 是因为配置了 之后，导致路径不正确，点击上面的链接即可 配置好 之后，你发现其他页面都没问题，图片也都能正常显示，但是 不能正常显示。 只需要把 中配置的 路径改下即可，加上 前缀 项目正常构建成功 是构建之后 文件夹中的内容，不包括 文件夹 等几分钟，一般一分钟以内 不停的刷新当前页面也行 然后就会发现当前页面多了个 模块 点击之后，就跳转到对应的网站链接啦… 我这边是
vite 构建的vue3 项目部署到github
weixin_44717047的博客
09-05 3678
vite 构建的vue3 项目部署到github
Vite + Vue3 部署 GitHub
paopao_pop的博客
05-22 585
因为在 yml 文件中是监控 push 事件，所以会自定发布。新建文件夹 .github 然后再建一个文件夹 workflows。因为静态资源是可以部署到 GitHub 上，自己顺便学习部署网站。在 Actions 里可以查看进度，成功以后就会生成一个地址。因为我使用的是 Vite 工具，官方有提供相应 Demo。打开项目 GitHub 地址，点击 Settings。记录自己的第一个 GitHub 部署项目。新建文件 main.yml 文件。直接使用官方文档 demo。
在github上部署静态页面｜前端项目（超详细）
weixin_51958960的博客
08-14 785
步骤1：新建项目，选择public公开的。步骤2：点击Row打开文件。步骤3：查看点开后的文件。
使用github免费部署前端项目
前端三脚猫的博客
04-27 2616
前言 在平时学习或者开发时，有时候会自己写一些项目和demo出来，当你想要给别人在线展示一下自己写的效果时在本地就会非常的不方便，当然我们也可以购买云服务器来自己搭建部署项目但是麻烦不说还需要花费一定的费用，那么有没有其他办法来部署自己的前端项目呢？ 答案是：当然有。github上就有可以部署前端项目的功能，下面就让我们一起看下怎么免费又快速的将自己的项目部署成功吧。 1、创建项目 首先登录到github官网（没有账号的需要自己根据步骤创建一个），然后点击右上角选择New repository （参考第一张
将 React 应用程序部署到 GitHub 页面
分享身边生活经验blog
10-15 1097
GitHub Pages 是 GitHub 的一项服务，可让您将 HTML、JavaScript 和 CSS 文件添加到存储库并创建托管静态网站。该网站可以托管在 GitHub 的域（例如，）或您自己的自定义域上。React 应用程序可以以类似的方式托管在 GitHub Pages 上。我们可以免费将我们的 React 应用部署到 GitHub 的域，但 Github Pages 也支持自定义子域 Apex 域。支持的自定义域例子www子域自定义子域顶点域现在，如果我们导航到React App。
VitePress搭建个人网站手把手教学(从搭建到部署在github服务器上)按照步骤直接cv就可以了
QQ的Blog
10-27 4882
VitePress搭建个人网站手把手教学(从搭建到部署再github服务器上通过外网访问)按照步骤直接cv就可以了
去中心化的前端构建工具 — Vite
m0_60028455的博客
06-08 3300
为什么要使用Vite 在浏览器中提供ES模块之前，开发人员没有以模块化方式编写JavaScript的本机机制。这就是为什么我们都很熟悉“捆绑”的概念:使用工具来抓取、处理和连接源模块到可以在浏览器中运行的文件中。 随着时间的推移，我们看到了webpack、Rollup和Parcel等工具，它们极大地改善了前端开发人员的开发体验。 然而，当我们开始构建越来越多雄心勃勃的应用程序时，我们要处理的JavaScript数量也呈指数级增长。对于大型项目来说，包含数千个模块并不罕见。我们开始遇到基于JavaScript
尝鲜！最新 VitePress 1 版本 + Github action，自动部署个人静态站点 SSG
03-26 966
散文，单纯就是想分享，内容不精。
记录：Vite项目搭建及使用GitHub Action将其发布到Github Pages实践、问题及解决方案
勿語念千的博客
08-29 2323
记录：Vite项目搭建及使用GitHub Action将其发布到Github Pages实践、问题及解决方案记录实践、问题及解决方案1.Vite项目搭建1.1.构建1.2.Volar插件1.2.1.问题1.2.2.解决方案2.使用GitHub Action将其发布到Github Pages2.1.设置GitHub Token2.2.编写yml文件2.3.pages Source设置2.4.问题2.5.解决方案 记录实践、问题及解决方案 VS Code 1.59.0 “vite”: “^2.4.4” “vu
Vite构建的Vue3项目打包部署到Gitee —— 全网最详细系列
前端之行，任重道远！
01-19 9192
最近利用Vite构建Vue3写了一个简单的ToDoList，想要部署到Gitee，并开启 Gitee Pages服务时出现页面空白的问题，参考了很多博客，尝试了很多办法都没有解决，正愁眉不展时我点开了Vite的官方文档，好家伙，直接茅塞顿开，原本这么小的一个问题被我想的太复杂了，还浪费了那么多时间，哎，此刻记录下我的解决办法，希望能帮到跟我有同样问题的人。 Vite构建的Vue3项目打包部署到GiteeVite部署静态站点官方文档一、本地打包测试构建应用（打包）本地测试应用我遇到的问题二、配置Gitee.
基于GitHub Actions工作流实现前端项目部署
qq_53437575的博客
04-29 365
介绍如何使用 GitHub Actions工作流实现前端项目独立 / 持续部署在华为云服务器
使用VitePress静态网站生成器创建组件库文档网站并部署到GitHub
Mr Dear的博客
06-07 3509
使用VitePress静态网站生成器创建vue-amazing-ui组件库使用文档，并部署到GitHub
Github Actions 构建Vue3 + Vite项目
牧夏的个人博客
07-13 120
本篇文章以自己创建的项目为例，用Actions构建。
GitHub Actions 部署前端项目
小陈的博客
05-27 478
我要部署一个项目，我大喊！！ 怎么做？ 先把代码 npm run build，把生成的 dist 拿来，登录服务器，到指定目录页面，打开 ftp，手动上传 dist 中的文件 其中你要开启你的 nginx 服务 你每一次想部署项目，就要先在本地打包，然后登录服务器，再打开 ftp 服务，再手动上传，这一来一回太麻烦，而且这种情况不利于多人开发，依赖的环境也许受操作系统的影响等等 总之，这不便于开发者以及不科学 我们需要持续集成 在公司中我们可以搭建 GitLab 亦或是 用 Jenkins，但是对个人，独立
使用github部署Vite打包的项目
最新发布
weixin_46836671的博客
07-18 580
vue项目部署在GitHub上介绍：使用pnpm包管理，通过在github线上打包，部署在线页面。
前端毕业设计代码提交部署到github上
精选资讯文章
06-02 299
以下是将前端毕业设计代码提交到Github上的一些步骤。其中，USERNAME是您的Github账户名，REPOSITORY是您创建的repository的名称。在您的Github账户中，点击“New repository”按钮来创建一个新的repository。其中，提交信息是您对本次提交的简短描述，例如“添加新功能”、“修复bug”等。在本地电脑上安装Git工具，以便能够将代码从本地提交到Github上。在Github上，您可以查看repository的提交记录和历史版本。创建Github账户。
Vite.js精选资源清单：快速构建前端项目
开发者可以使用Vite的构建命令来生产静态资源，并部署到任何静态文件服务器或CDN上。Vite官方也提供了指南来帮助开发者进行生产部署。 7. Vite与ESBuild Vite的一个主要优势在于它与ESBuild的集成。ESBuild是一个新...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Lucky小维

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值