테마 계층 구조

예를 들어 baseof.html 파일의 경우 doks 프로젝트 안에 두 개가 존재합니다.

  • node_modules@hyas\doks-core\layouts_default\baseof.html`
  • node_modules@hyas\core\layouts_default\baseof.htm ` 이유는 Doks 테마가 하위 테마(또는 상위 테마)를 포함하여 테마 계층 구조를 사용하기 때문입니다.

테마 계층 구조 이해

  • Doks 테마
    • @hyas/doks-core는 Doks 테마의 핵심 부분을 제공합니다.
    • 이 폴더에는 Doks 테마의 기본 레이아웃과 템플릿이 포함되어 있습니다.
  • Hyas Core
    • @hyas/core는 Doks 테마가 기반으로 하는 더 일반적인 템플릿과 레이아웃을 제공할 수 있습니다.
    • Hyas는 Hugo 테마 중 하나로, Doks가 이 테마를 상속받아 확장하는 방식으로 동작할 수 있습니다.

테마 우선 순위

Hugo는 테마 계층 구조에서 파일을 찾을 때 특정한 우선 순위를 따릅니다. 예를 들어, baseof.html 파일을 찾을 때 다음 순서로 파일을 검색합니다:

  • 사이트의 기본 레이아웃
    • layouts/_default/baseof.html
  • 활성 테마 (여기서는 @hyas/doks-core):
    • themes/doks-core/layouts/_default/baseof.html
  • 상위 테마 (여기서는 @hyas/core):
    • themes/core/layouts/_default/baseof.html 이 구조 덕분에 사용자는 특정 파일을 덮어써서 커스터마이즈할 수 있습니다. 기본적으로 doks-corebaseof.html을 사용하지만, core에 있는 파일로 대체할 수 있습니다.

두 파일의 역할

  • @hyas/doks-core/layouts/_default/baseof.html
    • Doks 테마의 기본 레이아웃 파일입니다.
    • 이 파일은 Doks 테마의 커스터마이징된 레이아웃과 스타일을 정의합니다.
  • @hyas/core/layouts/_default/baseof.html
    • Hyas Core 테마의 기본 레이아웃 파일입니다.
    • 이 파일은 Doks 테마에서 상속받아 사용하는 더 일반적인 레이아웃과 스타일을 정의할 수 있습니다.

어떤 파일을 수정해야 할까?

보통 @hyas/doks-core에 있는 baseof.html 파일을 수정합니다. 왜냐하면 이는 Doks 테마의 레이아웃을 정의하고 있으며, 사용자가 직접 커스터마이징하고자 하는 파일이기 때문입니다. 하지만 Hyas Core 테마에 대한 기본 레이아웃 변경이 필요하다면 @hyas/core에 있는 파일을 수정할 수 있습니다.