Skip to content

Commit 075616e

Browse files
update-the-docs
Update the docs
2 parents 4391354 + 6e5c648 commit 075616e

File tree

2 files changed

+231
-1
lines changed

2 files changed

+231
-1
lines changed

docs/src/pages/docs/deploy.mdx

Lines changed: 230 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,230 @@
1+
---
2+
title : Deploy
3+
---
4+
5+
import { Steps } from 'nextra-theme-docs'
6+
7+
To deploy a section blog theme on Vercel, Netlify, etc., you don't need a special requirement. You can deploy a section blog theme like the usual application.
8+
9+
But when you deploy the section blog theme on the GitHub page, you need GitHub action according to the node package manager.
10+
11+
## To Deploy on Github Pages
12+
13+
To deploy the section blog theme on **GitHub pages** follow the below step.
14+
15+
<Steps>
16+
17+
### Add output, basepath and unoptimized in nextjs config file.
18+
19+
```javascript {9-13} filename="next.config.js"
20+
/** @type {import('next').NextConfig} */
21+
22+
const withNextra = require("nextra")({
23+
theme: "section-blog-theme",
24+
themeConfig: "./theme.config.jsx",
25+
});
26+
27+
module.exports = withNextra({
28+
output: 'export',
29+
basePath: "/your-repostory-name",
30+
images:{
31+
unoptimized: true
32+
}
33+
});
34+
```
35+
36+
### PNPM
37+
If you use PNPM, then use the following code for GitHub action to deploy the nextjs app on the GitHub page.
38+
39+
```yml filename=".github/workflows/deploy-nextjs-app-with-pnpm.yml"
40+
# Sample workflow for building and deploying a Next.js site to GitHub Pages
41+
#
42+
# To get started with Next.js see: https://nextjs.org/docs/getting-started
43+
#
44+
name: Deploy Next.js site to Pages
45+
46+
on:
47+
# Runs on pushes targeting the default branch
48+
push:
49+
branches: ["main"]
50+
51+
# Allows you to run this workflow manually from the Actions tab
52+
workflow_dispatch:
53+
54+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
55+
permissions:
56+
contents: read
57+
pages: write
58+
id-token: write
59+
60+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
61+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
62+
concurrency:
63+
group: "pages"
64+
cancel-in-progress: false
65+
66+
jobs:
67+
# Build job
68+
build:
69+
runs-on: ubuntu-latest
70+
71+
steps:
72+
- name: Checkout
73+
uses: actions/checkout@v3
74+
75+
- name: Install Node.js
76+
uses: actions/setup-node@v3
77+
with:
78+
node-version: 20
79+
80+
- uses: pnpm/action-setup@v2
81+
name: Install pnpm
82+
id: pnpm-install
83+
with:
84+
version: 8
85+
run_install: true
86+
87+
- name: Get pnpm store directory
88+
id: pnpm-cache
89+
shell: bash
90+
run: |
91+
echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT
92+
93+
- uses: actions/cache@v3
94+
name: Setup pnpm cache
95+
with:
96+
path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
97+
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
98+
restore-keys: |
99+
${{ runner.os }}-pnpm-store-
100+
101+
- name: Install dependencies
102+
run: pnpm install
103+
104+
- name: Setup Pages
105+
uses: actions/configure-pages@v3
106+
with:
107+
static_site_generator: next
108+
- name: Static HTML export with Next.js
109+
run: pnpm next build
110+
- name: Upload artifact
111+
uses: actions/upload-pages-artifact@v1
112+
with:
113+
path: ./out
114+
115+
# Deployment job
116+
deploy:
117+
environment:
118+
name: github-pages
119+
url: ${{ steps.deployment.outputs.page_url }}
120+
runs-on: ubuntu-latest
121+
needs: build
122+
steps:
123+
- name: Deploy to GitHub Pages
124+
id: deployment
125+
uses: actions/deploy-pages@v2
126+
127+
```
128+
129+
### Yarn or NPM
130+
If you use YARN OR NPM, then use the following code for GitHub action to deploy the nextjs app on the GitHub page.
131+
132+
```yaml filename=".github/workflows/deploy-nextjs-app-with-yarn-or-npm.yml"
133+
# Sample workflow for building and deploying a Next.js site to GitHub Pages
134+
#
135+
# To get started with Next.js see: https://nextjs.org/docs/getting-started
136+
#
137+
name: Deploy Next.js site to Pages
138+
139+
on:
140+
# Runs on pushes targeting the default branch
141+
push:
142+
branches: ["main"]
143+
144+
# Allows you to run this workflow manually from the Actions tab
145+
workflow_dispatch:
146+
147+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
148+
permissions:
149+
contents: read
150+
pages: write
151+
id-token: write
152+
153+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
154+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
155+
concurrency:
156+
group: "pages"
157+
cancel-in-progress: false
158+
159+
jobs:
160+
# Build job
161+
build:
162+
runs-on: ubuntu-latest
163+
steps:
164+
- name: Checkout
165+
uses: actions/checkout@v4
166+
- name: Detect package manager
167+
id: detect-package-manager
168+
run: |
169+
if [ -f "${{ github.workspace }}/yarn.lock" ]; then
170+
echo "manager=yarn" >> $GITHUB_OUTPUT
171+
echo "command=install" >> $GITHUB_OUTPUT
172+
echo "runner=yarn" >> $GITHUB_OUTPUT
173+
exit 0
174+
elif [ -f "${{ github.workspace }}/package.json" ]; then
175+
echo "manager=npm" >> $GITHUB_OUTPUT
176+
echo "command=ci" >> $GITHUB_OUTPUT
177+
echo "runner=npx --no-install" >> $GITHUB_OUTPUT
178+
exit 0
179+
else
180+
echo "Unable to determine package manager."
181+
exit 1
182+
fi
183+
- name: Setup Node
184+
uses: actions/setup-node@v4
185+
with:
186+
node-version: "20"
187+
cache: ${{ steps.detect-package-manager.outputs.manager }}
188+
- name: Setup Pages
189+
uses: actions/configure-pages@v4
190+
with:
191+
# Automatically inject basePath in your Next.js configuration file and disable
192+
# server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
193+
#
194+
# You may remove this line if you want to manage the configuration yourself.
195+
static_site_generator: next
196+
- name: Restore cache
197+
uses: actions/cache@v3
198+
with:
199+
path: |
200+
.next/cache
201+
# Generate a new cache whenever packages or source files change.
202+
key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
203+
# If source files changed but packages didn't, rebuild from a prior cache.
204+
restore-keys: |
205+
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
206+
- name: Install dependencies
207+
run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
208+
- name: Build with Next.js
209+
run: ${{ steps.detect-package-manager.outputs.runner }} next build
210+
- name: Upload artifact
211+
uses: actions/upload-pages-artifact@v3
212+
with:
213+
path: ./out
214+
215+
# Deployment job
216+
deploy:
217+
environment:
218+
name: github-pages
219+
url: ${{ steps.deployment.outputs.page_url }}
220+
runs-on: ubuntu-latest
221+
needs: build
222+
steps:
223+
- name: Deploy to GitHub Pages
224+
id: deployment
225+
uses: actions/deploy-pages@v4
226+
227+
```
228+
Now push your local code into the GitHub repository and [enable GitHub pages permission](https://medium.com/frontendweb/how-to-deploy-the-next-js-app-router-application-on-github-pages-using-pnpm-54ac72424d80).
229+
230+
</Steps>

docs/src/pages/docs/page-configuration.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,7 @@ Show posts related to a tags page.
129129

130130
![Tags Page](/Tags.png " Tags Page ")
131131

132-
```markdown {2} filename="tags/[slug].mdx"
132+
```markdown {2} filename="tags/[tag].mdx"
133133
---
134134
type: tag
135135
---

0 commit comments

Comments
 (0)