てべすてん

<h1 id="%E3%82%B9%E3%82%AF%E3%82%B7%E3%83%A7">
<a class="header-anchor-link" href="#%E3%82%B9%E3%82%AF%E3%82%B7%E3%83%A7" aria-hidden="true"></a> スクショ</h1>
<p><img src="https://storage.googleapis.com/zenn-user-upload/f239cf573a36-20230302.png" alt loading="lazy" class="md-img"></p>
<p><img src="https://storage.googleapis.com/zenn-user-upload/b78fbe140ffc-20230302.png" alt loading="lazy" class="md-img"></p>
<h1 id="%E7%97%87%E7%8A%B6">
<a class="header-anchor-link" href="#%E7%97%87%E7%8A%B6" aria-hidden="true"></a> 症状</h1>
<ul>
<li>ボタンスタイルが当たらない</li>
<li>開発時(<code>yarn dev</code>)だと動かない。本番(<code>yarn start</code>)だと動く</li>
<li>特定ページだけ動かない。静的ページかどうかは関係ない</li>
<li>ホットリロードが効くとちゃんとスタイルが当たる</li>
<li>
<s>containedの時だけ効かない？</s>
<ul>
<li>一番最初にマウントされた種類のvariantだけ効かない</li>
</ul>
</li>
</ul>
<h1 id="%E4%BA%88%E6%83%B3">
<a class="header-anchor-link" href="#%E4%BA%88%E6%83%B3" aria-hidden="true"></a> 予想</h1>
<ul>
<li>nextjsだから？</li>
<li>サーバでキャッシュを変に持っちゃってる？</li>
</ul>


<h1 id="%E8%A7%A3%E6%B1%BA">
<a class="header-anchor-link" href="#%E8%A7%A3%E6%B1%BA" aria-hidden="true"></a> 解決</h1>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__2f985c35699b9" src="https://embed.zenn.studio/card#zenn-embedded__2f985c35699b9" data-content="https%3A%2F%2Fzuma-lab.com%2Fposts%2Fnext-mui-emotion-settings" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://zuma-lab.com/posts/next-mui-emotion-settings" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://zuma-lab.com/posts/next-mui-emotion-settings</a></p>
<p>emotionのキャッシュが関係してたらしい？</p>
