何事も1回ではうまくいかない。
環境設定が終わり、とりあえず・・・ドットインストールのVue講座うけとく?
と基本となるものを勉強してみた。
そして、次は・・・Laravel + VueのSPAのサンプルで慣れてみる?とやってみた。
参考: Laravel5.6とVue.jsで簡単なシングルページアプリケーション - Qiita
コピペ
まずは「習うより慣れろ」ってことでコピペしてみたわけで。
動いてからひとつひとつの機能を確認しつつ変更したいなぁと思っているわけですが。
Laravel Mix インストール
ここで
$ npm install
としてつまづきます。
なんと出てきたメッセージが
$ npm: command not found
なんですと!!!
npmが入ってないらしいです。案外、何も入っていないものだと思うものです。
一昨日はMySQLが入ってなかったわけで。
そう、npmはですね、いろいろ検索してみたのですが、ダウンロードしちゃえばいいんでしょ?的に。
参考:npm command not found と出てきた時の解決方法 - Qiita
まぁとりあえず、
$ npm -v 6.9.0
ってことなので、再度
$ npm install
まぁ順調に進みましたので割愛。
コピペ終了!
$ npm run dev
一応、成功したって通知が表示されるのだけど(必要なメッセージほどすぐに消える)再表示しても何も表示されない。
Console見たらエラー出てるし。
did you register the component correctly? For recursive components, make sure to provide the "name" option.
って・・・何?
Google先生曰く
コンポーネントを正しく登録しましたか?再帰的なコンポーネントの場合は、必ず "name"オプションを指定してください。
どこのこと〜!!!
下の方に何やらヒント的なものが。
Download the Vue Devtools extension for a better development experience: https://github.com/vuejs/vue-devtools You are running Vue in development mode. Make sure to turn on production mode when deploying for production. See more tips at https://vuejs.org/guide/deployment.html
とりあえず、Vue.js Devtoolsを機能追加してみた。
Chromeのバージョンアップでいろいろと変わるのか?
をポチする。だけでも駄目で。
拡張機能設定が必要らしい。
で、どこよ?って感じなんだけど、私の場合、ブラウザの右上に追加したアイコンが並んでてその「Vue」を右クリックすると
こんな感じでメニューが出てくるから「拡張機能を管理」をクリックして
これをオンにしなきゃいけないらしい。
まぁこれはただ「機能拡張」であって、今出ているエラーが解消するわけではない。
「Vue」のタブが追加されてました〜!!!
エラーの数は同じでーす。
このタブの使い方を勉強しなきゃ意味がないということだけ今わかってます。