Vue: ssr予期しないハイドレーションベイルアウト

@FranckFreiburgerに感謝します。Mac と Windows で問題を再現しようとしましたが、どちらも問題ありF5 key場合、F5 でページをリロードするという意味は何ですか?

Windows 7、ノード v8.1.2、最新の Google Chrome と Firefox でテスト済み。
vue-hackernews-2.0 デモを複製した後、 App.vueを変更して<pre>タグを追加しました。
次にnpm run devを実行すると、ページが初めて読み込まれたときに問題が発生します (ページのリロード時に問題が再び発生します)。

グーグル開発ツールを使って、
問題の直前にスクリプトの実行を一時停止すると、マークアップ (開発ツールの [要素] タブ) は次のようになります。

<pre style="background-color:#aaa;">foobar
        </pre>

スクリプトの実行を続行すると、マークアップは次のようになります。

<pre style="background-color:#aaa;">
foobar
        </pre>

ネットワーク タブからのデータは正しいようです。最初の HTTP GET リクエストには次のものが含まれています。

<pre style="background-color:#aaa;">
foobar
        </pre>

注: <pre>ではなく<div style="white-space:pre;">では問題は発生しません。

ありがとう、わかった。 私はそれを調べようとしています。

@FranckFreiburgerこれはバグのようです。 仕様によるとhttps://www.w3.org/TR/html5/syntax.html#element-restrictions

pre 要素と textarea 要素の開始タグの直後に単一の改行を配置できます。 要素のコンテンツが改行で始まることを意図している場合、作成者は2つの連続した改行を含める必要があります。

pre タグの直後のfirst改行は無視されますが、vue html コンパイラーは無視されます。

修正してみます。