tanatiyo 今、Vue.jsの勉強をしていて、動作を Codepenで確認しながら進めていますが
コードをお手本通りに書いているのに、想定通りに表示されない時があります。
そんな時に確認してうまくいった方法がありますので、ここにメモ_φ(･_･しておきます。
コードの中に全角スペースや全角の記号が隠れていないか
これって意外と見落とすんですが、Codepenでは半角スペースを打ったのか、全角スペースを打ったのかわからなくなる時があります。（これって簡単にわかる方法があるのかな？もしわかる方いらっしゃったら教えてほしいです！！orz）
本来なら半角スペースや半角の記号が入っていなければならないところに、全角が入ってしまっているかどうかは要確認です。
もし、VScodeに全角が入っているのを簡単に見分けることができる拡張機能を入れている場合、Codepenのコードを一旦全て、 Vscode上にコピペして探すのも有効です！
私はそれで確認し、全角部分を修正して再度Codepen側に戻したら、正常に表示されました！
私の場合、スペースも記号も全角が混じっていました。記号が全角なら正常に表示されないと思いますが、もしかしたらスペースが全角の場合、コードの場所によっては、そのままでも正常に表示される可能性もあると思います。
あくまでも私の体験談なので、ご参考までに。
CSSやJSの設定でCDNなどの読み込みを忘れていないか
これはVue.jsの勉強ではないのですが、CodepenでSwiperやSplide、modalやscroll関連のライブラリを使って勉強している時に少し躓いたところなので、ここも一緒にメモしておきます。
これらのライブラリを使う時は、JavascriptやCSSでCDNを読み込んで使う場合があります。
基本的には一つのライブラリで、JavascriptもCSSもどちらもCDNを読み込んで使うことが多いと思っていたほうが（と疑って実装したほうが）、実装漏れがない気がします（個人的見解です）。
以上となります。また他にも、Codepenで気をつけた方が良い点など出てきたら記事にしていこうと思います。