首页 > 其他分享 >vue3+vite+ elementplus项目部署到gitee pages并发布

vue3+vite+ elementplus项目部署到gitee pages并发布

时间:2023-10-02 15:45:34浏览次数:41  
标签:git 仓库 demo gitee elementplus vue3 vite

1.在gitee上新建仓库

  命名:demo-vite-vue3

2.把新建的仓库克隆到本地

3.在本地的master分支编写代码并上传

  1. 把分支定位在master分支
  2. 通过git工具把本地完成的代码上传到gitee的demo-vite-vue3仓库中去
    git pull
    git add .
    git commit -m"提交代码"
    git push

4.打包代码

  • 1.通过npm run build命令把完成的代码打包,生成了dist文件夹
  • 2.在.gitignore文件中,把dist注释掉(允许dist文件夹上传到远程gitee仓库)
  • 3.在vite.config.js文件中,换成gitee远程仓库的名称,如下
     base: process.env.NODE_ENV === "production" ? "/demo-vite-vue3/" : "/"

  •  4.上传改变的代码到远程仓库demo-vite-vue3

5.gitee部署

 然后就可以通过生成的网站地址来访问部署的网站。

标签:git,仓库,demo,gitee,elementplus,vue3,vite
From: https://www.cnblogs.com/pwindy/p/17739969.html

相关文章

  • Vue3 appear 失效 如何使用 appear
    最近在学习vue3的动画时遇到appear 无法生效的问题问题的具体表现:看以下代码,按理应该来说,如果我们设置fuct-appear-from,fuct-appea-active后在元素初始出现时应该会有一个效果html<Transitionname="fuct"appear><divclass="doc"v-if="show"></div></Trans......
  • Uniapp学习笔记(vue3)
    https://uniapp.dcloud.net.cn/使用Vue.js开发所有前端应用的框架开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝)、快应用等多个平台。周边生态丰富发送请求 methods:{ getMsg(msg){ ......
  • 使用vite创建vue3项目
    vite是一种新型前端构建工具,能够显著提升前端开发体验,它主要由两部分组成;一个开发服务器,它基于 原生ES模块 提供了 丰富的内建功能,如速度快到惊人的 模块热更新(HMR)。一套构建指令,它使用 Rollup 打包你的代码,并且它是预配置的,可输出用于生产环境的高度优化过的静态资......
  • 掌握Vue3 Props:提升你的前端开发技能
    Prop类型到这里,我们只看到了以字符串数组形式列出的prop:props:['title','likes','isPublished','commentIds','author']但是,通常你希望每个prop都有指定的值类型。这时,你可以以对象形式列出prop,这些property的名称和值分别是prop各自的名称和类型:props:{title:S......
  • uniapp自动引入Vue3(ref,reactive...)的API、uniapp生命周期和封装hooks
    未自动导入Vue3(ref,reactive...)的API和uniapp生命周期,需要在每个页面把API和uniapp生命周期的代码都重复写一遍<scriptsetup>import{ref,reactive}from"vue"import{onLaunch,onShow,onHide}from'@dcloudio/uni-app'//封装的hooksimport{useLi......
  • Vue3
    Vue3介绍 Vue3的变化1.性能的提升打包大小减少41%初次渲染快55%,更新渲染快133%内存减少54%2.源码的升级使用Proxy代替defineProperty实现响应式重写虚拟DOM的实现和Tree-Shaking(摇树--清除死代码进行优化)3.拥抱TypeScript Vue3可以更好的支持TypeScri......
  • 记录--Vue3 + Fabricjs 定制国庆专属头像
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助生在国旗下,长在春风里!国庆将至,采黎为大家带来定制头像2.0(国庆头像),让我们用代码的形式为祖国庆生!欢迎大家点赞收藏加关注哦前言想看效果或者想定制春节头像的小伙伴请直奔效果区域;想一睹定制头像2.0小工具的......
  • vue3项目结合antdesignvue封装form表单及校验
    效果图 完整代码1<scriptsetup>2import{defineProps,onMounted,reactive,ref,defineEmits}from'vue'3import{Card,Input,Select,DatePicker,FormItem,Form,Button}from'ant-design-vue'4import{useRuleChe......
  • vue3项目table表格动态表头生成+行数据合并
    这两处地方是动态的,由后端数据返回思路流程  1,后端返回数据二次处理  2,根据后端数据生成动态表头  3,利用antd的customRender与rowSpan设置行合并 完整代码<template><Table:data-source="dataSource":columns="columns":pagination="......
  • Vue3 - provide 提供的异步数据 inject 得到的数据 undefined 或 null
    如下所示,父组件(祖先组件)通过provide函数向所有后代组件传递prop。但是这两个Ref类型的数据最开始没有,需要等到onMounted初始化之后才有值。此时会遇到两个问题后代组件在setup函数中或者onBeforeMount等非常周期中调用,可能获取的是undefined或者null。传递响应式......