首页 > 其他分享 >使用Github Action在Github Pages上部署vue页面

使用Github Action在Github Pages上部署vue页面

时间:2023-09-11 12:01:13浏览次数:46  
标签:GitHub name vue Github build Action Pages

Github Action部分:

name: NodeJS

on:
  push:
    branches: [ "master" ]

# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
  contents: write

# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
  group: "pages"
  cancel-in-progress: false

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 

标签:GitHub,name,vue,Github,build,Action,Pages
From: https://www.cnblogs.com/sigeer0-o/p/17693172.html

相关文章

  • Vue2x的自定义指令
    在某些情况下,我们需要对底层DOM进行操作,而内置的指令不能满足需求,就需要自定义指令。一个自定义指令由一个包含类似组件的生命周期的钩子的对象来定义,钩子函数会接收到指令所绑定的元素作为参数。定义指令常用两种方式进行自定义指令,一种是全局定义,另一种在当前组件中定义//局......
  • vue兄弟组件传参
    实现兄弟组件之间的参数传递可以通过以下方法:使用共同的父组件来传递参数。在父组件中定义一个数据属性,用于保存需要传递给兄弟组件的参数。Copyexportdefault{data(){return{message:'Hello',};},};在父组件的模板中引用两个兄弟组......
  • vue2打包组件发布到npm
    1.使用vuecreateprojectName新建一个项目2.将src的文件夹名称改为example,便于我们调试代码3.增加packages文件夹,其下面的index.js代码如下importpanelfrom'./panel/index.vue'constcomponents=[panel]constinstall=function(Vue){if(install.i......
  • vue3下载文件
    constdow=async(url:string,fileName:string)=>{mulSelUrls.value=[]mulSelUrls.value.push(urlasnever)constrequests=mulSelUrls.value.map(url=>axios.get(url,{responseType:'blob'}));try{constresponses=aw......
  • vue项目成功引入element组件的具体步骤
    1、首先要确保vue项目能够成功在浏览器访问2、一般使用的是vue3那么,需要注意的是,element组件在vue3里面,需要使用的是element-plus命令:npminstallelement-plus--save--legacy-peer-deps下载完成之后,需要在main.js里面对element组件进行引入:importElementPlusfrom'ele......
  • vue使用富文本编辑器vue-quill-editor,含拖拽图片,调整默认高度
    这两天的工作用到了vue\-quill-editor,来记录一下使用心得/踩过的坑供大家参考。1、安装npminstall vue-quill-editornpminstallquill2、引入main.js里样式也记得引入:importVueQuillEditorfrom'vue-quill-editor'import'quill/dist/quill.core.css'import'quill/dist/qu......
  • 运行vue项目一直报错的问题的解决
    问题描述(上图为网图,自己的没来得及截图)问题解决第一个原因:vue版本过低;使用下面的语句进行版本升级:[email protected]但是我试了没啥用;第二个原因:node版本过低;使用下面的语句进行版本升级:--若是已经有更高级的版本,可以直接更换:nvmlistnvmuse版本--若是没有,就自己......
  • Vue组件传值方法
    使用propsprops是用于向子组件传递数据的一种方式。父组件可以将数据传递给子组件的props属性,子组件则可以通过props来访问这些数据。父组件:<template><div><child-component:message="message"></child-component></div></template>子组件:<template><div>{......
  • Vue进阶(幺陆柒):Vue 项目调试技能
    (文章目录)一、前言在Vue项目开发过程中,当遇到应用逻辑出现错误,但又无法准确定位的时候,知晓Vue项目调试技巧至关重要。同后台项目开发一样,可以在JS实现的应用逻辑中设置断点,并进行单步、进入方法内、跳出方法等调试,从而准确定位问题根源。本文主要讲解针对JetBrains系列WebStor......
  • 用vue开发新项目的前期步骤流程
     一、git代码托管平台1)注册登录:Gitee-基于Git的代码托管和研发协作平台2)在码云上传本地已存在项目:编辑编辑3)安装git::https://git-scm.com/4)克隆码云上的项目到本地:gitclone仓库地址5)搭建项目环境6)将代码上传到gitee.com的仓库中:git的使用,查看另外一篇文章二、搭建vue项目环......