【FlutterxFirebase】FlutterFire CLIを導入しようと思ったんだが

Dart

概要

どうも、@daiki1003です!

本記事はシンプルにFlutterFire CLIの導入手順を
途中で詰まったところも含めて解説していこうとおもいます!

CLI | FlutterFire
The FlutterFire CLI is a useful tool which provides commands to help ease the installation process

ゴール

flutterfireコマンドが叩けるようになること

対象読者

これからflutterfireコマンドを使えるようにしたい方
flutterfireに興味を持っている方

筆者環境

OS:macOS Monterey 12.3.1
シェル:fish

npmの追加

筆者環境は、まずnpmが使える状況ではなかったのでこれが使えるようにします。

nodebrewのインストール

$ brew install nodebrew

完了したら

$ nodebrew -vで正しくバージョンやコマンドリストが表示されることを確認します。

node.jsのインストール

$nodebrew install-binary latest

が、しかし。
筆者の環境ではこれが失敗しました。

$ nodebrew install-binary latest
Fetching: https://nodejs.org/dist/v18.0.0/node-v18.0.0-darwin-x64.tar.gz
Warning: Failed to create the file
Warning: /Users/${your_name}/.nodebrew/src/v18.0.0/node-v18.0.0-darwin-x64.tar.gz: No
Warning: such file or directory

curl: (23) Failed writing body (0 != 1020)
download failed: https://nodejs.org/dist/v18.0.0/node-v18.0.0-darwin-x64.tar.gzど

どうやら以下のコマンドを叩くだけで解決しました。

$ mkdir -p ~/.nodebrew/src

完了したら

$ nodebrew listと打ってみましょう。
そうすると、

$ nodebrew list
v18.0.0

current: none

の様になっているので

$ nodebrew use v18.0.0で使用するnodeのバージョンを指定します。
もう一度下記のように nodebrew listを叩き、currentが変わっていたら成功です。

$ nodebrew list
v18.0.0

current: v18.0.0

firebase_toolsのインストール

npm install -g firebase-toolsを叩くも…

一応インストール手順には

$ npm install -g firebase-tools

を実行しろと書いているので実行してみます。
が、筆者の環境では以下のようにエラーが出てしまいました。

$ npm install -g firebase-tools
npm WARN deprecated har-validator@5.1.3: this library is no longer supported
npm WARN deprecated debug@4.1.0: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797) npm WARN deprecated debug@4.1.1: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142

changed 688 packages, and audited 689 packages in 22s

35 packages are looking for funding
  run `npm fund` for details

21 vulnerabilities (15 moderate, 6 high)

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

言われた通りにやってみると…

$ npm audit fix
npm ERR! code ENOLOCK
npm ERR! audit This command requires an existing lockfile.
npm ERR! audit Try creating one first with: npm i --package-lock-only
npm ERR! audit Original error: loadVirtual requires existing shrinkwrap file

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/${your_name}/.npm/_logs/2022-05-01T14_52_34_819Z-debug-0.log

npm iなどの駆使

how to fix npm audit error with loadVirtual and ENOLOCK?
➜ npm audit npm ERR! code ENOLOCK npm ERR! audit This command requires an existing lockfile. npm ERR! audit Try creating one first with: npm i --package-lock-...

にあるようにやってみました。

$ npm i --package-lock-only
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /Users/${your_name}/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/${your_name}/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/${your_name}/.npm/_logs/2022-05-01T15_44_47_998Z-debug-0.log
$ npm config get package-lock
true
$ npm config get shrinkwrap
true
$ npm i --package-lock-only
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /Users/${your_name}/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/${your_name}/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/${your_name}/.npm/_logs/2022-05-01T15_44_47_998Z-debug-0.log
$ npm audit fix

up to date, audited 1 package in 51ms

found 0 vulnerabilities

なんか途中怒られてましたが上手くいったようです。
この辺詳しくわかる方がいらっしゃいましたら、Twitterかコメントで教えてください。

flutterfire_cliの有効化

$ dart pub global activate flutterfire_cliを叩くもこちらも怒られました。

$ dart pub global activate flutterfire_cli
/Users/${your_name}/.asdf/shims/dart: line 5: /opt/homebrew/Cellar/asdf/0.8.1_1/libexec/bin/asdf: No such file or directory
/Users/${your_name}/.asdf/shims/dart: line 5: exec: /opt/homebrew/Cellar/asdf/0.8.1_1/libexec/bin/asdf: cannot execute: No such file or directory

これは本当に書いてる通りで/Users/${your_name}/.asdf/shims/dart
5行目に書かれているパスが存在しないものでした。
なので、上記ファイルをvimで開き、0.8.1_1ではなく、
存在する0.9.0に変更したところ正しく動作しました!

これで晴れて…

flutterfireコマンドが使えるようになりました!

誰かのお役に立てば。

Twitterフォローお願いします

「次回以降も記事を読んでみたい!」
「この辺分からなかったから質問したい!」

そんな時は、是非Twitter (@daiki1003)Instagram (@ashdik_flutter)のフォローお願いします♪

Twitterコミュニティ参加お願いします

Twitterコミュニティ「Flutter lovers」を開設しました!
参加お待ちしております😁

☕️ Buy me a coffee

また、記事がとても役に立ったと思う人は
コーヒーを奢っていただけると非常に嬉しいです!
@daiki1003

コメント

タイトルとURLをコピーしました