Export To Hugo

Provide Strapi v5 to generate your hugo. This plugin is open to everyone and everyone can contribute and modify it. The future of Export To Hugo is decided by each of you.

Features

• Automatically generate Strapi Content-Type suitable for Hugo, avoiding manual creation and saving time.
• Export the data of Strapi v5 into the files required by hugo to facilitate hugo operation.
• Automatically git commit and push to Github

Version

Strapi version: V5 (The following tutorial is based on 5.13.1)

Hugo version: Not Sure. (The following tutorial is based on hugo_extended_0.147.4)

Directory

You need to create a project directory.

There are two folders under the project root directory, one is hugo and the other is strapi. You can't change their names.

Install

git init

Hugo

In the following examples, I use the hugo_extended_0.147.4 as a demonstration.

.\hugo.exe new site hugo

If you have your own template, you can install it via git submodule.

Or you can install your template via any method supported by hugo.

git submodule add https://YOUR_THEME_URL.git hugo/themes/YOUR_THEME_DIRECTORY

Strapi

Run the following command in a terminal:

npx create-strapi@latest strapi

Here is an example, You can set them according to your needs.

? Please log in or sign up. (Use arrow keys)
> Login/Sign up
? Please log in or sign up. Skip
? Do you want to use the default database (sqlite) ? (Y/n)
? Do you want to use the default database (sqlite) ? Yes
? Start with an example structure & data? (y/N)
? Start with an example structure & data? No
? Start with Typescript? (Y/n) n
? Start with Typescript? No
? Install dependencies with npm? (Y/n)
? Install dependencies with npm? Yes
? Initialize a git repository? (Y/n) n
? Initialize a git repository? No

Export To Hugo

Run the following command in a terminal:

cd .\strapi\
npm i strapi-export-to-hugo

Start Strapi

npm run dev

How To Use

Generating Content-Type

After logging into Strapi, on the left side of the menu bar, select export-to-hugo.

Select Content-Type Generator.

After Clicking, you will be prompted that the creation is successful. Then return to Content Manager to see the automatically generated Content-Type.

Then you can complete all your Hugo content, just in Strapi.

Generate Gugo Files

On the left side of the menu bar, select Hugo File Generator.

Click the second button to update the hugo file.

Sync to Github

You need to add something to your .env file.

#Github
GITHUB_REPO=YOUR_GITHUB_NAME/YOUR_GITHUB_REPO
GITHUB_BRANCH=YOUR_REPO_BRANCH
GITHUB_USERNAME=YOUR_GITHUB_NAME
GITHUB_TOKEN=YOUR_GITHUB_TOKEN

On the left side of the menu bar, select Sync to GitHub (The third button)

Just wait patiently for your Github to update. It will automatically commit and push operations.

Start Hugo

cd .\hugo\
.\hugo.exe server --gc

Development

Prerequisites

yalc must be installed globally (with npm install -g yalc or yarn global add yalc).

Local Publishing

In export-to-hugo directory

npm install
npm run build
yalc publish

In strapi directory

npx yalc add --link strapi-export-to-hugo
npm install
yalc update strapi-export-to-hugo
npm run dev

Publishing to npm

npm login
npm publish

Thanks

This project thanks Cursor for his help.