fix[bug]: スマホで正常に表示できない #2
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Preview Environment | |
| on: | |
| issue_comment: | |
| types: [created] | |
| workflow_dispatch: | |
| inputs: | |
| pr_number: | |
| description: "PR number to deploy" | |
| required: true | |
| type: number | |
| permissions: | |
| contents: read | |
| pull-requests: write | |
| concurrency: | |
| group: preview-${{ github.event.issue.number || inputs.pr_number }} | |
| cancel-in-progress: true | |
| jobs: | |
| deploy-preview: | |
| runs-on: ubuntu-latest | |
| if: | | |
| (github.event_name == 'issue_comment' && | |
| github.event.issue.pull_request && | |
| contains(github.event.comment.body, '/deploy-preview')) || | |
| github.event_name == 'workflow_dispatch' | |
| env: | |
| CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }} | |
| CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }} | |
| CLOUDFLARE_DATABASE_ID: ${{ secrets.CLOUDFLARE_DATABASE_ID }} | |
| PR_NUMBER: ${{ github.event_name == 'workflow_dispatch' && inputs.pr_number || github.event.issue.number }} | |
| steps: | |
| - name: Add reaction to comment | |
| if: github.event_name == 'issue_comment' | |
| uses: actions/github-script@v7 | |
| with: | |
| script: | | |
| github.rest.reactions.createForIssueComment({ | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| comment_id: context.payload.comment.id, | |
| content: 'rocket' | |
| }); | |
| - name: Get PR branch | |
| id: pr-branch | |
| uses: actions/github-script@v7 | |
| with: | |
| script: | | |
| const pr = await github.rest.pulls.get({ | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| pull_number: process.env.PR_NUMBER | |
| }); | |
| core.setOutput('ref', pr.data.head.ref); | |
| core.setOutput('sha', pr.data.head.sha); | |
| - name: Checkout PR branch | |
| uses: actions/checkout@v4 | |
| with: | |
| ref: ${{ steps.pr-branch.outputs.sha }} | |
| - name: Setup PNPM | |
| uses: pnpm/action-setup@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: 22 | |
| cache: pnpm | |
| - name: Install dependencies | |
| run: pnpm install --frozen-lockfile | |
| - name: Generate wrangler.toml from example | |
| run: | | |
| cp wrangler.toml.example wrangler.toml | |
| sed -i "s/PLACEHOLDER_DATABASE_ID/${CLOUDFLARE_DATABASE_ID}/g" wrangler.toml | |
| - name: Generate API wrangler.toml from example | |
| working-directory: apps/api | |
| run: | | |
| cp wrangler.toml.example wrangler.toml | |
| sed -i "s/PLACEHOLDER_DATABASE_ID/${CLOUDFLARE_DATABASE_ID}/g" wrangler.toml | |
| - name: Deploy API to preview environment | |
| working-directory: apps/api | |
| run: | | |
| WORKER_NAME="tabitabi-api-preview-pr-${PR_NUMBER}" | |
| pnpm wrangler deploy --name ${WORKER_NAME} --env preview | |
| - name: Get API preview URL | |
| id: api-url | |
| run: | | |
| echo "url=https://tabitabi-api-preview-pr-${PR_NUMBER}.oranda.workers.dev/api/v1" >> $GITHUB_OUTPUT | |
| - name: Build web with preview API URL | |
| run: pnpm run build | |
| env: | |
| VITE_API_URL: ${{ steps.api-url.outputs.url }} | |
| - name: Deploy Web to Pages preview | |
| id: pages-deploy | |
| working-directory: apps/web | |
| run: | | |
| BRANCH_NAME="preview-pr-${PR_NUMBER}" | |
| OUTPUT=$(pnpm wrangler pages deploy .svelte-kit/cloudflare --project-name=tabitabi --branch=${BRANCH_NAME}) | |
| echo "$OUTPUT" | |
| URL=$(echo "$OUTPUT" | grep -oP 'https://[a-z0-9-]+\.tabitabi\.pages\.dev' | head -1) | |
| echo "url=${URL}" >> $GITHUB_OUTPUT | |
| - name: Comment PR with preview URLs | |
| uses: actions/github-script@v7 | |
| with: | |
| script: | | |
| const apiUrl = '${{ steps.api-url.outputs.url }}'; | |
| const webUrl = '${{ steps.pages-deploy.outputs.url }}'; | |
| const comment = `## 🚀 Preview Environment Ready | |
| Your preview environment has been deployed: | |
| - **Web App**: ${webUrl} | |
| - **API**: ${apiUrl} | |
| The Web app is configured to access the preview API automatically. | |
| To update this preview, comment \`/deploy-preview\` again. | |
| > **Note**: Preview environments share the same database as production.`; | |
| github.rest.issues.createComment({ | |
| issue_number: process.env.PR_NUMBER, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| body: comment | |
| }); |