next项目部署到GitHub模板

使用github actionnext项目部署到GitHub pages的模板:

在项目根目录下新建.github/workflows 目录,并在其下新建一个 yaml文件,文件名字任意。

在文件中写入以下模板,并推送到github仓库即可(可按需更改,模板可通过github pages页面 - 通过github actions部署选项中获取):

在这里插入图片描述

name: deploy Next.js site to Pages
on:
  push:
    branches: ["main"]
  # 允许手动运行此工作流
  workflow_dispatch:
# 设置 GITHUB_TOKEN 的权限以允许部署到GITHUB页面
permissions:
  contents: read
  pages: write
  id-token: write
# 允许一个并发部署
concurrency:
  group: "pages"
  cancel-in-progress: true

# 部署设置与步骤
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - name: Detect package manager
        id: detect-package-manager
        run: |
          if [ -f "${{ github.workspace }}/yarn.lock" ]; then
            echo "::set-output name=manager::yarn"
            echo "::set-output name=command::install"
            echo "::set-output name=runner::yarn"
            exit 0
          elif [ -f "${{ github.workspace }}/package.json" ]; then
            echo "::set-output name=manager::npm"
            echo "::set-output name=command::ci"
            echo "::set-output name=runner::npx --no-install"
            exit 0
          else
            echo "Unable to determine packager manager"
            exit 1
          fi
      - name: Setup Node
        uses: actions/setup-node@v3
        with:
          node-version: "16"
          cache: ${{ steps.detect-package-manager.outputs.manager }}
      - name: Setup Pages
        uses: actions/configure-pages@v2
        with:
          # Automatically inject basePath in your Next.js configuration file and disable
          # server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
          #
          # You may remove this line if you want to manage the configuration yourself.
          static_site_generator: next
      - name: Restore cache
        uses: actions/cache@v3
        with:
          path: |
            .next/cache
          # Generate a new cache whenever packages or source files change.
          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
          # If source files changed but packages didn't, rebuild from a prior cache.
          restore-keys: |
            ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
      - name: Install dependencies
        run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
      - name: Build with Next.js
        run: ${{ steps.detect-package-manager.outputs.runner }} next build
      - name: Static HTML export with Next.js
        run: ${{ steps.detect-package-manager.outputs.runner }} next export
      - name: Upload artifact
        uses: actions/upload-pages-artifact@v1
        with:
          path: ./out

  # Deployment job
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    needs: build
    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v1
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以将 Flask 项目部署GitHub Pages 或者使用 GitHub Actions 自动部署到服务器。 方法一:部署到 GitHub Pages 1. 在 GitHub 上创建一个新的 repository。 2. 在本地创建一个 Flask 项目,并将其推送到 GitHub repository。 3. 在项目根目录下创建一个名为 `docs` 的文件夹,并在其中创建一个名为 `index.html` 的文件。此文件将作为 GitHub Pages 的主页。 4. 在项目根目录下创建一个名为 `.github/workflows` 的文件夹,并在其中创建一个名为 `deploy.yml` 的文件。此文件将自动部署项目GitHub Pages。 5. 在 `deploy.yml` 文件中添加以下代码: ```yaml name: Deploy on: push: branches: - main jobs: deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v2 - name: Setup Python uses: actions/setup-python@v2 with: python-version: '3.x' - name: Install dependencies run: pip install -r requirements.txt - name: Build static files run: | export FLASK_APP=app.py flask build - name: Deploy to GitHub Pages uses: peaceiris/actions-gh-pages@v3 with: github_token: ${{ secrets.GITHUB_TOKEN }} publish_dir: ./docs ``` 6. 推送代码到 GitHub repository,GitHub Actions 将自动部署项目GitHub Pages。 方法二:使用 GitHub Actions 自动部署到服务器 1. 在 GitHub 上创建一个新的 repository。 2. 在本地创建一个 Flask 项目,并将其推送到 GitHub repository。 3. 在服务器上安装 Docker 和 Docker Compose。 4. 在项目根目录下创建一个名为 `.github/workflows` 的文件夹,并在其中创建一个名为 `deploy.yml` 的文件。此文件将自动部署项目到服务器。 5. 在 `deploy.yml` 文件中添加以下代码: ```yaml name: Deploy on: push: branches: - main jobs: deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v2 - name: Setup Python uses: actions/setup-python@v2 with: python-version: '3.x' - name: Install dependencies run: pip install -r requirements.txt - name: Build static files run: | export FLASK_APP=app.py flask build - name: Build Docker image run: | docker-compose build - name: Push Docker image to registry uses: docker/build-push-action@v2 with: context: . push: true tags: user/app:${{ github.sha }} env: DOCKER_USERNAME: ${{ secrets.DOCKER_USERNAME }} DOCKER_PASSWORD: ${{ secrets.DOCKER_PASSWORD }} - name: Deploy to server uses: appleboy/ssh-action@master with: host: ${{ secrets.HOST }} username: ${{ secrets.USERNAME }} key: ${{ secrets.KEY }} port: ${{ secrets.PORT }} script: | docker-compose pull docker-compose up -d ``` 6. 在项目根目录下创建一个名为 `docker-compose.yml` 的文件,用于定义 Docker 容器。 ```yaml version: '3' services: app: image: user/app:${{ github.sha }} ports: - 80:5000 ``` 7. 在服务器上创建一个名为 `.env` 的文件,并在其中添加以下代码: ```bash FLASK_APP=app.py FLASK_ENV=production SECRET_KEY=<your-secret-key> ``` 8. 在服务器上运行以下命令以启动容器: ```bash docker-compose pull docker-compose up -d ``` GitHub Actions 将自动构建和部署 Docker 容器到服务器上。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值