Я пытаюсь создать блог stati c, используя Hu go и эти руководства ( здесь и здесь ).
Я установил Hu go и создал небольшой пост в блоге для тестирования. Страница отображается правильно, когда я запускаю в браузере hugo server -D
и go - localhost:1313
. Однако страница отображается некорректно, когда я просто открываю public/index.html
в браузере.
Я использую файл конфигурации , который поставляется с темой, которую я использую. В файле конфигурации я изменил атрибут темы на имя темы и baseURL на '/', а также другие поля меньшего размера, такие как автор, описание и авторские права.
Почему index.html
правильно ли отображается, когда он обслуживается с локального сервера Hu go, но не когда я просто обращаюсь к нему как к файлу через браузер?
Вот мой блог правильно отображается через Hu go сервер
Вот мой блог некорректно отображается из-за прямого доступа к файлам
Это мой файл конфигурации
theme = "soho"
baseURL = "/"
title = "Personal Blog" # "The World's Okayest Programmer"
languageCode = "en"
enableInlineShortcodes = true
summarylength = 10
enableEmoji = true
[params]
author = "My Name"
description = "My Blog"
## Set one of:
# gravatar = "soho@example.com"
profilePicture = "images/profile.png"
copyright = "My Name"
license = "CC BY-SA 4.0"
licenseURL = "https://creativecommons.org/licenses/by-sa/4.0"
## Set custom theme color.
# themeColor = "#fc2803"
## Set custom CSS and/or JS to override site defaults.
customCss = ["css/blog.css"]
customJs = ["js/blog.js"]
## Set as many as you want.
[[params.socialIcons]]
icon = "fa-linkedin"
title = "Linkedin"
url = "#"
[[params.socialIcons]]
icon = "fa-github"
title = "GitHub"
url = "#"
[[params.socialIcons]]
icon = "fa-twitter"
title = "Twitter"
url = "#"
[menu]
[[menu.main]]
name = "Posts"
weight = 100
identifier = "posts"
url = "/posts/"
[[menu.main]]
name = "About"
identifier = "about"
weight = 300
url = "/about/"
[taxonomies]
category = "categories"
series = "series"
tag = "tags"
[markup]
[markup.highlight]
codeFences = true
guessSyntax = false
hl_Lines = ""
lineNoStart = 1
lineNos = false
lineNumbersInTable = true
noClasses = true # if false, you need to provide you own custom CSS
style = "monokai"
tabWidth = 4
И это public/index.html
, созданный Hu go
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="generator" content="Hugo 0.72.0" />
<title>Personal Blog</title>
<meta name="description" content="My Blog" />
<meta itemprop="name" content="Personal Blog">
<meta itemprop="description" content="My Blog">
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="Personal Blog" />
<meta name="twitter:description" content="My Blog" />
<meta property="og:title" content="Personal Blog" />
<meta property="og:description" content="My Blog" />
<meta property="og:type" content="website" />
<meta property="og:url" content="/" />
<link type="text/css" rel="stylesheet" href="/css/print.css" media="print">
<link type="text/css" rel="stylesheet" href="/css/poole.css">
<link type="text/css" rel="stylesheet" href="/css/hyde.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css"
integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144-precomposed.png">
<link rel="shortcut icon" href="/favicon.png">
<link href="/index.xml" rel="alternate" type="application/rss+xml" title="Personal Blog" />
</head>
<body>
<aside class="sidebar">
<div class="container">
<div class="sidebar-about">
<div class="author-image">
<img src="/images/profile.png" class="img-circle img-headshot center" alt="Profile Picture">
</div>
<h1>Personal Blog</h1>
<p class="lead">My Blog</p>
</div>
<nav>
<ul class="sidebar-nav">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/posts/">Posts</a>
</li>
<li>
<a href="/about/">About</a>
</li>
</ul>
</nav>
<section class="social-icons">
<a href="#" rel="me" title="Linkedin" target="_blank">
<i class="fab fa-linkedin" aria-hidden="true"></i>
</a>
<a href="#" rel="me" title="GitHub" target="_blank">
<i class="fab fa-github" aria-hidden="true"></i>
</a>
<a href="#" rel="me" title="Twitter" target="_blank">
<i class="fab fa-twitter" aria-hidden="true"></i>
</a>
</section>
</div>
</aside>
<main class="content container">
<div class="posts">
</div>
</main>
<footer>
<div>
© My Name 2020
· <a href="https://creativecommons.org/licenses/by-sa/4.0" target="_blank">CC BY-SA 4.0</a>
</div>
</footer>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/js/all.min.js"
integrity="sha256-MAgcygDRahs+F/Nk5Vz387whB4kSK9NXlDN3w58LLq0=" crossorigin="anonymous"></script>
</body>
</html>