z_blog:2018:181201_nuxt_bulma_responsive
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
z_blog:2018:181201_nuxt_bulma_responsive [2018/12/02] – [Vuexストアを設定してトグルONとOFFをstoreに定義] adash333 | z_blog:2018:181201_nuxt_bulma_responsive [2018/12/02] (現在) – [ソースコード] adash333 | ||
---|---|---|---|
行 259: | 行 259: | ||
</ | </ | ||
+ | pages/ | ||
+ | {{: | ||
+ | pages/ | ||
+ | {{: | ||
+ | あれ?store is not defined というNuxt.jsのエラーが出てしまった。 | ||
+ | |||
+ | < | ||
+ | エラーもなかなか見つけにくい。。。(Ionic(Angular)のときは、ChromeでCtrl+Shift+Iでconsole logを見ると、どのファイルの何行目にどのようなエラーがありそうか、けっこう教えてくれる感じであった。) | ||
+ | |||
+ | {{: | ||
+ | |||
+ | pages/ | ||
+ | {{: | ||
+ | |||
+ | まだ行がずれていてかっこ悪いが、これで、なんとか、ハンバーガーメニューが実装できた。 | ||
+ | |||
+ | しかし、ハンバーガーメニューの3本線を「メニュー」という文字にしたり、ボタンにしたりしようとすると、なんだかデザイン的に自分の思うように変更できない。。。 | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | ===== NuxtサイトをNetlifyにデプロイ ===== | ||
+ | |||
+ | 公式サイトに書いてあった。 | ||
+ | |||
+ | https:// | ||
+ | {{: | ||
+ | |||
+ | Netlifyでの画面はこんな感じ。 | ||
+ | |||
+ | {{: | ||
+ | |||
+ | デプロイ後のサイト | ||
+ | |||
+ | https:// | ||
+ | |||
+ | |||
+ | ===== ソースコード ===== | ||
+ | https:// | ||
+ | |||
+ | ===== Navbar-brandをNavbar-blandとタイプミスしていた ===== | ||
+ | |||
+ | ハンバーガーメニューがずれていたので、何がおかしいのかずっと分からなかったが、Navbar-brandのタイプミスであった。 | ||
+ | |||
+ | VisualStudioCodeの拡張機能で、Bulmaのタイプミスを指摘してくれるものはないかな??? | ||
+ | |||
+ | components/ | ||
+ | |||
+ | (変更前) | ||
+ | {{: | ||
+ | |||
+ | (変更後) | ||
+ | {{: | ||
+ | |||
+ | これでやっと写経できた。 | ||
- | ===== リンク ===== | ||
===== Nuxt.jsでお勧めの本(2018年現在) ===== | ===== Nuxt.jsでお勧めの本(2018年現在) ===== | ||
z_blog/2018/181201_nuxt_bulma_responsive.1543729666.txt.gz · 最終更新: 2018/12/02 by adash333