步骤:
1.进入github主页面
2.点击右上角自己的头像,点击Your repositories,进入自己的仓库,下图提示
3.进入Your repositories以后,点击绿色的New。下图所示
4.创建自己的仓库,下图所示
5.创建完成以后进入到以下页面,把下边这两段代码按序复制到项目中
6.复制到自己的项目中,下图所示
7.进入到刚才在github新创建的仓库,查看文件是否上传成功
8.文件上传成功以后点击上方列表第四个进入到Actions页面
9.点击set up a workflow yourself 跳转
10.把下方代码复制到里边,然后点击右上角的绿色按钮
name: Vue Deploy
on:
push:
branches:
- master
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
- name: Set up Node.js
uses: actions/setup-node@v2
with:
node-version: '14'
- name: Install dependencies
run: npm install
- name: Build
run: npm run build
- name: Deploy to GitHub Pages
uses: peaceiris/actions-gh-pages@v3
with:
github_token: ${{ secrets.PAT }} # 此处修改为你的Secret名称
publish_dir: ./dist
11.出现弹窗直接点击绿色按钮
12.页面跳转以后点击右上角自己的头像,选择Settings
13.进入Settings页面以后,找到左侧列表的最后一个选项Developer settings
14.选择Personal access tokens下的Fine-grained tokens,然后点击右上角的Generate new token
15.有时可能需要需要输入密码,直接输入自己的github密码就行了
16.跳转到原来的页面,按以下步骤操作
17.选择Repository permissions选项,把每一项右边的下拉框选项选为
Read and write 如果没有Read and write的选项,则选为 Read-only
18.选完以后就直接点击最下方的绿色按钮Generate token
19.跳转页面以后,把下方这个链接保存好
20.复制好这个链接以后,再次进入到自己刚刚创建的仓库,按照以下步骤操作
21.跳转页面以后,按以下步骤操作
22.接下来进入到创建的项目中,找到根目录下的,vue.config.js
在里边添加上路径
publicPath: '/'
vue.config.js
23.下来在编辑器终端里边执行以下操作上传:
1.git add .
2.git commit -m "备注"
3.git pull
4.git push
24.上传完成以后,再次回到自己刚刚创建的仓库,点击Actions
25.上传完成以后,进入Settings选项,进行以下步骤操作
26.点击 Visit site跳转到自己的项目里边,自动部署就创建完成了