Vue.js | POPWEB

Nuxt.jsで「TypeError: Cannot set property ‘render’ of undefined」のコソールエラー対処法

エラー内容 Nuxt.jsで開発中、以下のコンソールエラーが出て画面が表示されなくなった。原因と対処法 <script>タグの閉じタグがなかったり、空の<script>タグが存在しているとエラーとなるため、 …

Nuxt + Firebaseで開発をしていて、Firebaseのテストモジュール入れ、開発サーバを起動したらcore.js関連のエラーがずらっと出た。原因 NuxtとFirebase使われるcore.jsのバージョン …

Vue.jsのスロットの使い方をざっくり説明する。開発にはVue CLIを使っている前提で話を進めていく。スロットコンテンツスロットコンテンツでは、親コンポーネントから子コンポーネントへコンテンツを丸ごと渡しあげる …

mountedやupdatedを使用してもでは子コンポーネントを全てをマウントしたことは保証しないため、子コンポーネントへアクセスがうまくいかない時がある。そこ解決するために、$nextTickを使用してDOMの更新サ …

vue create <プロジェクト名>コマンドを入力すると以下のようなエラーがでた。 XcodeあるいはCLTのバージョンがおかしいらしい。解決方法について GitHubのnode-gypにあったものを参 …

いつもはVue.jsのフレームワークであるNuxt.jsで開発を行なっているが、Vue CLIでの開発環境の構築をしてみる。事前にNode.jsをインストールしておく。 Vue CLIのインストールコマンドラインを起 …

Nuxt.jsで開発中に以下のエラーが出てハマった。エラーメッセージにあるように、nameオプションで指定してもダメだった。今回の場合、原因はコンポーネント間の循環参照の記述方法だった。 Vue.jsのドキュメントの …

動的なコンポーネントについて説明する。開発環境ははVue CLIを使っている前提で話を進めていく。動的なコンポーネントの記述方法動的にコンポーネントを切り替えるために、複数コンポーネントを用意しておく。そして記述 …

Nuxt.jsで状態管理を行うライブラリであるVuexのクラシックモードとモジュールモードについて説明。まず、新規Nuxtプロジェクトを作成以下、コマンドでテスト用にNuxtプロジェクトを作成しておく。初期設定をど …

v-modelは双方向データバインディングを行うディレクティブであるが、カスタムコンポーネントでv-modelを使う場合、少しややこしい。 v-modelの中身の動作についてまず、v-modelには、別の書き方がある。 …