概要 ローカル環境でSNS認証のテストをするためにはhttps化に対応する必要がありました。そのため、nuxt.config.jsのserverプロパティにhttpsのプロパティを追加して、発行した証明書を設定する記述を […]
Vue.jsの記事
JavaScript
【Nuxt.js】本番環境と開発環境でnuxt.config.jsのプロパティの内容を書き換える
JavaScript
GitHub ActionsでNuxtでgenerateした静的サイトを自動デプロイ
Nuxt.jsで開発した静的サイトを手動でレンタルサーバーなどにアップロードしようとすると 手元でyarn generateする distフォルダ以下をFTP等で手動でアップロードする というなんともめんどくさい手順を踏 […]
JavaScript
Laravel9系,Nuxt.js2系でSNSログイン(Twitter,FaceBook,LINE)機能を実装する
Nuxt.js2系(compositon API)とLaravel9系＋Laravel Socialite + Sanctum + Fortifyを使ってTwitter,facebook,LINEのログイン機能を実装しま […]
JavaScript
【Vue.js3系】FormDataで画像ファイルとオブジェクトを一緒にaxiosのPUTで送ろうとするとnullになった
Nuxt.jsとLaravelで開発中のアプリの管理画面でオブジェクトのデータと画像ファイルの更新機能を作ろうとした際にdataが送れずに困ったので備忘録を残しておきます。 失敗例 最初JSON文字列に変換する方法が間違 […]
JavaScript
Nuxt.jsのuseContext() をVuexの中で使うと、This must be called within a setup function. のエラーになる
Nuxt.js2系のcomposition APIを使用してSPAモードの開発をしています。 .envファイルに定義した環境変数を、nuxt.config.jsのpublicRuntimeConfigに定義して以下のよう […]
JavaScript
Nuxt.jsのgenerateコマンドでビルドした静的ファイルをレンタルサーバーにアップしてリロードすると404エラーになる
Nuxt.jsのSPAモードで作成したアプリケーションをXserverにアップした時に上記の問題が発生しました。 開発環境ではリロードしても404エラーにはならなかったので気にもしていなかったのですが、よくよく考えればV […]
JavaScript
Vue.js(Nuxt.js),composition apiでpropsの値が取得できない
Nuxt.js2系のcomosition apiで親から子にpropsで値を渡して取得した値の変更を検知したい時にどうしても検知できなくて悩んだので備忘録を残しておきます。 propsの値が受け取れなかった書き方。 pr […]
JavaScript
【Vue.js2】日付型を文字列型（YYYY-MM-DD）の書式に変換する
日付データの変換によくmoment.jsやday.jsなどが使われていますが、今回はライブラリを使用しない方法を紹介いたします。 v-modelで入ってきた値をcomputedで変換しています。
JavaScript
Vue.jsで都道府県の定数を定義して、プルダウンのセレクトボックスを作る
定数ファイルを作成 定数をimportしてセレクトボックスを作る 都道府県ファイルをインポートしたらv-forを使って都道府県を表示させます。
JavaScript
Vue.js3系(composition API)で郵便番号から住所検索機能(yubinbango-core2)を実装する
jQueryなどで郵便番号検索機能を実装する際はyubinbango.jsなどを使うことが多いかと思いますが、Vue.jsでは「yubinbango-core2」という郵便番号のライブラリをインストールすることで実装する […]