search

dirkolbrich / hugo-tailwindcss-starter-theme

Starter files for a Hugo theme with Tailwindcss
MIT License
400 stars 55 forks source link

[question] working from root instead of exampleSite #29

Closed ghost closed 3 years ago

ghost commented 3 years ago

First of all - thank you for this boilerplate!

I am still new to Hugo and a little confused about themes and working inside exampleSite dir.

Can I simply move the contents of exampleSite to the root directory and work there? And if yes, I guess I will need to change the directory of themeDir inside postcss.config.js in order for it to work correctly when deploying to production?

dirkolbrich commented 3 years ago

You don’t dev your theme within the /exampleSite directory. This directory holds example content for your theme only. In an ideal case /exampleSite has just some .md files with dummy content and a minimal front matter setup (title, author, date). All your development work should be done in the /layout folder of your theme or directly within /layout of your project repo.

There are 3 use cases for this starter repo:

  1. Develop a Hugo theme as a stand alone repo. This is the main use case for this starter repo.

    For this you need the /exampleSite directory if you have custom content for your theme, e.g. a special front matter setup or a special folder structure for your content.

    This /exampleSite directory is picked up by the gohugoio/hugoThemes repo to showcase the demo of your site on themes.gohugo.io. See adding a theme to the list for further instructions.

  2. Develop a theme within the /themes folder of your Hugo project. For this you don’t need the /exampleSite directory, as you work directly from the content of your project and propably don’t distribute the theme to other projects. Though I think it is a good habit to have this folder to document the intended structure of your /content folder for later use.

  3. Develop a Hugo site without using a theme, but instead work directly from the main /layout folder (content and theme as a mono-repo). For this you don’t need to change the setup of the postcss.config.js, but instead move the content of /themes/hugo-theme-tailwindcss-starter/assets to the /assets folder of you project and develop within /layout. The setup should work just fine.