雨果能检测到 CSS 的更改,但输出没有变化。

5

我正在使用Hugo构建一个网页。

这是我的网站头部:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Website</title>
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" /> -->
    <meta name="referrer" content="no-referrer" />
    <link rel="icon" href="/img/favicon.ico" type="image/x-icon" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.2/tiny-slider.css"
    />

    <!-- tried this as per suggestion from Hugo forums
    {{ $sassIncludes := (slice "node_modules" "assets/scss/vendor" "assets/scss/components") }}
    {{ $target := "styles/main.css" }}
    {{ if .Site.IsServer }}
        {{ $cssOpts := (dict "targetPath" $target "enableSourceMap" true "includePaths" $sassIncludes ) }}
        {{ $styles := resources.Get "/css/main.scss" | toCSS $cssOpts }}
        <link rel="stylesheet" href="{{ $styles.Permalink }}" media="screen">
    {{ else }}
        {{ $cssOpts := (dict "targetPath" $target "includePaths" $sassIncludes ) }}
        {{ $styles := resources.Get "/css/main.scss" | toCSS $cssOpts | postCSS | minify | fingerprint }}
        <link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen">
    {{ end }} -->

    {{ $style := resources.Get "/css/main.scss" | resources.ToCSS | minify | fingerprint}}

    <link rel="stylesheet" href="{{ $style.RelPermalink }}"/>
  </head>

  <body>
    <header>
      <div class="nav-bar">
        <a class="top-logo" href="/">
          <img src="/img/logo.svg" />
        </a>
    </header>
  </body>
</html>

以下是 main.scss 文件:

@import 'reset';
@import 'commonStyles';
@import 'pricing';
@import 'docs';
@import 'header';
@import 'footer';
@import 'home';

header {
  .nav-bar {
    background-color: red;
  }
}

config.toml:

baseURL = "http://example.org/"
languageCode = "en-us"
title = "Website"
assetDir = "static"

我正在 macOS 上使用hugo server命令运行。我正在样式中更改背景颜色。这是终端输出:

thatsme/../website-landing (master↑1|✚7…) % hugo server                                        
Building sites … WARN 2020/05/18 12:27:34 found no layout file for "HTML" for kind "taxonomyTerm": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
WARN 2020/05/18 12:27:34 found no layout file for "HTML" for kind "taxonomyTerm": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.

                   | EN  
-------------------+-----
  Pages            | 14  
  Paginator pages  |  0  
  Non-page files   |  0  
  Static files     | 19  
  Processed images |  0  
  Aliases          |  0  
  Sitemaps         |  1  
  Cleaned          |  0  

Built in 17 ms
Watching for changes in /Users/thatsme/git/website-landing/{archetypes,content,data,layouts,static}
Watching for config changes in /Users/thatsme/git/website-landing/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

Change of Static files detected, rebuilding site.
2020-05-18 12:27:42.202 +0200
Syncing css/main.scss to /

只有在重新启动服务器时样式更改才会生效。HTML 更改可以正常应用。


我尝试在Chrome控制台中禁用缓存,尝试运行hugo server -w --noHTTPCache --disableFastRender -v - stkvtflw
1
如果我在 {{ $style := resources.Get "/css/main.scss" | resources.ToCSS | minify | fingerprint}} 中更改了某些内容,输出将会被更新。例如,如果我删除或添加了 fingerprint - stkvtflw
1
让我意识到我需要在Firefox中使用Ctrl + F5 - JonasVautherin
1个回答

1

以下命令可以解决问题:

hugo serve --noHTTPCache --ignoreCache --disableFastRender

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接