ブログ

読んで思い出す。忘れるために書く

Nuxt.js + Firestore でデータを引っ張ってくる

Nuxt.js + Cloud Firestore でドキュメント データを引っ張ってくるコードが書けた、のでその記録

とくに手順とかは説明しない

リポジトリgouf/firebase_demo で、実際にデータを表示させてる部分は ここ, 設定は ここ

詳しくは公式ドキュメントを参照されたい

Links

node-sass インストール時に gyp 関連でエラーが出た

Rails 使ってるのに Node.js とか Python とか云われても わからん...

環境

  • MacOS Big Sur Ver.11.1
  • anyenv + pyenv

概要・状況

  1. Rais プロジェクトで
  2. yarn install したら
  3. node-sass をインストールするために
  4. node-gyp をインストールしようとして
  5. python2 が見つからなくて そこでコケた

原因

anyenv, pyenv を利用して Python のバージョン切り替え... 3系を利用していた

解決

Rails プロジェクト ディレクトリのルートに .python-version を設置し、2系を定義した

(pyenv local 2.7.18 を実行した)

ログ全文

gouf@gouf-MacBook-Pro:~/my_rails_app (main)$ yarn install
yarn install v1.22.10
warning ../package.json: No license field
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning " > webpack-dev-server@3.11.0" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
[4/4] 🔨  Building fresh packages...
[-/3] ⠐ waiting...
[-/3] ⠐ waiting...
error /Users/gouf/my_rails_app/node_modules/node-sass: Command failed.
Exit code: 1
Command: node scripts/build.js
Arguments:
Directory: /Users/gouf/my_rails_app/node_modules/node-sass
Output:
Building: /usr/local/Cellar/node/15.3.0/bin/node /Users/gouf/my_rails_app/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [
gyp verb cli   '/usr/local/Cellar/node/15.3.0/bin/node',
gyp verb cli   '/Users/gouf/my_rails_app/node_modules/node-gyp/bin/node-gyp.js',
gyp verb cli   'rebuild',
gyp verb cli   '--verbose',
gyp verb cli   '--libsass_ext=',
gyp verb cli   '--libsass_cflags=',
gyp verb cli   '--libsass_ldflags=',
gyp verb cli   '--libsass_library='
gyp verb cli ]
gyp info using node-gyp@3.8.0
gyp info using node@15.3.0 | darwin | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` succeeded python2 /Users/gouf/.anyenv/envs/pyenv/shims/python2
gyp ERR! configure error
gyp ERR! stack Error: Command failed: /Users/gouf/.anyenv/envs/pyenv/shims/python2 -c import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack pyenv: python2: command not found
gyp ERR! stack
gyp ERR! stack The `python2' command exists in these Python versions:
gyp ERR! stack   2.7.16
gyp ERR! stack   2.7.18
gyp ERR! stack
gyp ERR! stack Note: See 'pyenv help global' for tips on allowing both
gyp ERR! stack       python2 and python3 to be found.
gyp ERR! stack
gyp ERR! stack     at ChildProcess.exithandler (node:child_process:309:12)
gyp ERR! stack     at ChildProcess.emit (node:events:376:20)
gyp ERR! stack     at maybeClose (node:internal/child_process:1055:16)
gyp ERR! stack     at Socket.<anonymous> (node:internal/child_process:441:11)
gyp ERR! stack     at Socket.emit (node:events:376:20)
gyp ERR! stack     at Pipe.<anonymous> (node:net:661:12)
gyp ERR! System Darwin 20.2.0
gyp ERR! command "/usr/local/Cellar/node/15.3.0/bin/node" "/Users/gouf/my_rails_app/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /Users/gouf/my_rails_app/node_modules/node-sass
gyp ERR! node -v v15.3.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok

ログの見方

今回注目すべきは 次の2行だった

gyp verb `which` succeeded python2 /Users/gouf/.anyenv/envs/pyenv/shims/python2

gyp ERR! stack pyenv: python2: command not found

python2 の path は見つかるものの、pyenv global で 3系を有効化してるので python2 コマンドが利用できない、という状況になっていた

Links

Nuxt.js + Netlify に入門した

とりあえず、「ボーナスステップ」まで進めてのデプロイまで

リポジトリを作った

github.com

Netlify に デプロイした

f:id:innocent-zero:20210108191916p:plain
Netlify にデプロイした Hello ページ

このコミット で、Hello の表示以外に /funページが表示される ように設定してる

Nuxt.js を利用すれば Vue.js アプリケーションが簡単に作れるし、Netlify を利用すれば デプロイが簡単にできる

Links

LanguageClient-neovim を導入した

[F2] キーに設定した <Plug>(lcn-rename) 機能が強力だった

たとえばクラス名のリネームをすれば、それが使われてるファイル全体で書き換えをしてくれる

リネーム作業中の様子

(sed しなくてもよくなるぞ...!!)

VimIDE にまた一歩近づいた

設定について

anyenv を導入してるので、solargraph を起動させるためのパス指定もそっちに寄せる必要があった

Before:

let g:LanguageClient_serverCommands = {
    \ 'ruby': ['~/.rbenv/shims/solargraph', 'stdio']
    \}

After:

let g:LanguageClient_serverCommands = {
    \ 'ruby': ['~/.anyenv/envs/rbenv/shims/solargraph', 'stdio']
    \}

今回は Ruby だけではあるけど、Python など他の言語を設定する際も気をつけたい

Links

2020年のアウトプットと参加イベントを振り返る

LAPRAS の機能が新設されていたので試してみた

以下コピペ

2020年のアウトプットと参加イベントを振り返ると

今年アウトプットしたものや参加したイベントなどをまとめてみました。

teratail

connpass

Github

Link