YAML文件插入html代码导致的语法错误-工具盒子

错误 {#错误}

|---------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 | ERROR Process failed: _data/widget.yml YAMLException: bad indentation of a sequence entry (41:31) 40 | .cp-weather { 41 | background: #bec7cb; ---------------------------------------------^ 42 | } |

原因 {#原因}

例如

|---------------------------------|----------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 | top: - class_name: id_name: name: icon: fas fa-desktop html: - <style> .cp-weather { background: #bec7cb; } ...... |

在这里面

为hexo框架构建网站是向侧边栏添加一段html代码

代码中却含有 background: #bec7cb;
将误认为background以YAML语法对应#bec7cb
但是其位置位于top下的html：中
如果background同样为top下于html，icon为同等地位时正确的代码应该是这样的
top:
  - class_name:
    id_name:
    name:
    icon: fas fa-desktop
    html: 
      - <style>
            .cp-weather {
    background: #bec7cb;
            }

省略为
top:




* 
  class_name:
  id_name:
  name:
  icon: fas fa-desktop
  html: ......
  background: #bec7cb;



  ......
  所以生成器认为此次为background缩进错误
  因为yaml语法定位为  " : "
  错误指向甚至有位于  " : "下






于是报错：
ERROR Process failed: _data/widget.yml
YAMLException: bad indentation of a sequence entry (41:31)

`错误进程失败：_data/widget.yml
YAMLException：序列条目的不良缩进 （41：31）
`

错误指向的是html代码中的一个 :

是YAML语法错误导致的问题。

请注意在YAML文件中正确缩进序列（sequence）的条目。

来自chatGPT的解释

错误提示中的错误原因是YAML语法中的错误缩进。在YAML文件中，缩进非常重要，它用于表示数据结构之间的层次关系。在您的情况下，错误发生在第41行，因为它没有正确缩进。

根据您提供的代码片段，看起来您正在编辑一个YAML文件，其中包含一系列条目。在YAML中，序列（sequence）是由一个连字符 - 开始，并且其后的条目需要正确缩进。

根据错误消息，缩进问题发生在第41行的 background: #bec7cb; 这一行。您需要确保该行与前一行的缩进级别相同，以保持正确的语法结构。例如，您可以将该行的缩进与前一行的 cp-weather 属性相同，像这样：

|-------------|------------------------------------------------------------------------------------------------| | 1 2 | 41 | cp-weather: 42 | background: #bec7cb; |

请注意，YAML文件对缩进使用空格，而不是制表符。在这个示例中，我使用了4个空格来缩进该行，以与前一行的缩进级别相匹配。

确保在整个YAML文件中使用一致的缩进，以避免语法错误。如果您的YAML文件中还有其他错误，可以根据错误消息来解决它们。

解决方法 {#解决方法}

 top:
  - class_name:
    id_name:
    name:
    icon: fas fa-desktop
    html: 
      - |
      <style>
            .cp-weather {
    background: #bec7cb;
            }
            ......

请注意，我在插入的HTML代码块前添加了|以保持代码块的格式。您可以将这段YAML代码添加到您的配置文件中，确保正确缩进每个条目。这样就可以将实时天气的HTML代码插入到指定的位置。

  使用
  - |
  ......
  的方式告诉计算机
  此次html后的均为插入的代码
  是html的格式而不是yaml的语法格式

解决方式即

|---------------------------------|------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 | html: - ...... 添加 |变为 html: - | ...... |

相关信息 {#相关信息}

时间：2023/7/1

平台：win11/hexo: 6.3.0

错误：ERROR Process failed: _data/widget.yml
YAMLException: bad indentation of a sequence entry

改后:

|---------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | top: - class_name: id_name: name: icon: fas fa-desktop html: - | </div><div class="aside-box"><h2 class="widget-title">实时天气</h2> <div class="cp-weather"> <div id="he-plugin-standard"></div> </div> <style> .cp-weather { background: #bec7cb; } #he-plugin-standard { width: 100% !important; } .wv-lt-refresh { display: none; } </style> <script> WIDGET = { "CONFIG": { "layout": "2", "height": 270, "background": "2", "dataColor": "434343", "key": "4837d979e7114d26b28e328aa856d6f8" } } </script> <script data-minify="1" src="https://yukaidi.top/wp-content/cache/min/1/standard/static/js/he-standard-common.js?ver=1670640184"></script> |