VueCLIにFirebaseを追加するときに困ったこと一覧

こんにちは柴田クロノスケです。
今回はVueJSにFirebaseを追加する際にいろいろつまずいたので覚え書き程度にQ&A形式で紹介していきたいと思います。

1.いやVue CLI動かないじゃん

vue create hogehoge

と入力してEnterを押すと実行ポリシーの関係でVueコマンドが実行できない
↓

Set-ExecutionPolicy RemoteSigned -Scope Process

で直る!!!
参考:https://docs.microsoft.com/ja-jp/powershell/module/microsoft.powershell.core/about/about_execution_policies?view=powershell-7.2

2.Firebase追加方法わからん;o;

意外といろんなサイト見てもVueCLIへの追加方法が書いていません
⇒Firebase公式に載っているコードでいいっぽい

vue create hogehoge
cd hogehoge
npm install --save firebase

で普通に使えます。

2(.2).Firebaseコードどこで実行するの;o;

これもあんまり説明されてません(わからないの僕だけ?)
⇒App.vueとかrouter使ってるならviews/以下のファイルのscriptタグの中に書き込む
(export defaultの外側)
⇒Firebase v9になってもimportの方法は変わってない!!!(公式ドキュメントそのまま)

2(.2.1).FirebaseConfigをどこに設置するの;o;

App.vue(export defaultの外側)に追加します。
Vue Routerを使っている場合でもApp.vueに追加するだけで動くようになります。