AMP 验证错误：“标签 'head > style[amp-boilerplate]' 中的强制文本缺失或不正确。”

Question

我从here 复制并粘贴了强制代码。 这是来自页面来源：

  <style amp-boilerplate>
        body {
            -webkit-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            -moz-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            -ms-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            animation: -amp-start 8s steps(1,end) 0s 1 normal both
        }

        @-webkit-keyframes -amp-start {
            from {
                visibility: hidden
            }

            to {
                visibility: visible
            }
        }

        @-moz-keyframes -amp-start {
            from {
                visibility: hidden
            }

            to {
                visibility: visible
            }
        }

        @-ms-keyframes -amp-start {
            from {
                visibility: hidden
            }

            to {
                visibility: visible
            }
        }

        @-o-keyframes -amp-start {
            from {
                visibility: hidden
            }

            to {
                visibility: visible
            }
        }

        @keyframes -amp-start {
            from {
                visibility: hidden
            }

            to {
                visibility: visible
            }
        }
    </style>
    <noscript>
        <style amp-boilerplate>
            body {
                -webkit-animation: none;
                -moz-animation: none;
                -ms-animation: none;
                animation: none
            }
        </style>
    </noscript>

我仍然收到以下验证错误：

标签“head > style[amp-boilerplate]”内的强制文本是 缺失或不正确。 （看 https://github.com/ampproject/amphtml/blob/master/spec/amp-boilerplate.md)

任何提示将不胜感激。

Answer 1

AMP 希望样板文件保持最小化。我刚刚将您的样板代码粘贴到 AMP Playground 文档中，并得到了与您完全相同的错误。

只是为了确认它是缩小版，我从你的帖子中缩小了你的样板，它起作用了。

<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>

编辑：

我做了更多的游戏。您可以在开始和结束标签之前和之后添加返回。似乎禁止向 CSS 本身添加任何回车或空格。

<style amp-boilerplate> 
    body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
 </style>
 <noscript>
   <style amp-boilerplate>
     body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}
   </style>
 </noscript>

Here is a link 解释 AMP 样板代码和允许的更改。基本上你只能在标签之后立即添加空格，你可以在已经存在的地方添加更多的空格。

AMP HTML 文档的 head 标记中必须包含以下样板文件。目前验证是通过正则表达式完成的，因此尽可能减少突变很重要。目前，允许的突变是：（1）在样式标签打开后立即插入任意空格，并在其关闭前立即插入； (2) 用任意空格替换下面sn-p中的任何空格。