Nuxt環境構築備忘録 - 他人の金で焼き肉が食べたい

nuxtでなんかやってみよーということでBig Surで環境構築をする。

brewでnodenvをインストール
nodenvでnodeをインストール
create-nuxt-app
起動

brewでnodenvをインストール

https://github.com/nodenv/nodenv#installationに則って作業を進める

❯ brew install nodenv

NG！
Version value must be a string; got a NilClass ()というエラーが出て初手からくじかれ、仕方ないので brew upgrade する（これがめっっっっっちゃ長かった、放置していたツケです）: https://stackoverflow.com/questions/64821648/homebrew-fails-on-macos-big-sur
再度installコマンドチャレンジするも Killed hoge的なのが出る。これはterminal再起動で解決します

❯ brew install nodenv

❯ nodenv -v
nodenv 1.4.0

ようやくnodenv入った🎉

# .zshrcに追記
eval "$(nodenv init -)"

terminalを再起動してからnodenv-doctorで環境がちゃんとできているかチェック

❯ curl -fsSL https://github.com/nodenv/nodenv-installer/raw/master/bin/nodenv-doctor | bash
Checking for `nodenv' in PATH: /usr/local/bin/nodenv
Checking for nodenv shims in PATH: OK
Checking `nodenv install' support: /usr/local/bin/nodenv-install (node-build 4.9.26)
Counting installed Node versions: none
  There aren't any Node versions installed under `/Users/hoge/.nodenv/versions'.
  You can install Node versions like so: nodenv install 2.2.4
Auditing installed plugins: OK

OK！

nodenvでnodeをインストール

❯ nodenv install 14.15.4
❯ nodenv global 14.15.4
❯ nodenv versions
* 14.15.4 (set by /Users/hoge/.nodenv/version)

OK！

create-nuxt-app

ja.nuxtjs.org いつ入れたんだか分からないがnpxがいたのでnpxを使う

❯ npx nuxt -v
# 初めてだったせいかなにかチェックしていて時間がかかった
@nuxt/cli v2.14.12

OK！次！

❯ npx create-nuxt-app nuxt-playground

create-nuxt-app v3.5.0
✨  Generating Nuxt.js project in nuxt-playground
? Project name: nuxt-playground
? Programming language: TypeScript
? Package manager: Npm
? UI framework: Tachyons
? Nuxt.js modules: Axios - Promise based HTTP client
? Linting tools: ESLint, Prettier
? Testing framework: Jest
? Rendering mode: Universal (SSR / SSG)
? Deployment target: Server (Node.js hosting)
? Development tools: jsconfig.json (Recommended for VS Code if you're not using typescript)
? Continuous integration: GitHub Actions (GitHub only)
? What is your GitHub username? hoge
? Version control system: Git

各項目についてはこちら(https://qiita.com/nakazawaken1/items/675b7e16b793330db410)やこちら(https://qiita.com/dama-a/items/c8e9053444b2aecbe5ca) を参考にしました
UI frameworkにTachyonsを選んだのは名前がかっこよかったからです！！！
んで待ってるとnpmで諸々入れてくれる

🎉  Successfully created project nuxt-playground

  To get started:

    cd nuxt-playground
    npm run dev

  To build & start for production:

    cd nuxt-playground
    npm run build
    npm run start

  To test:

    cd nuxt-playground
    npm run test


  For TypeScript users.

  See : https://typescript.nuxtjs.org/cookbook/components/

OK！

起動

❯ cd nuxt-playground
❯ npm run dev

http://localhost:3000/ にアクセス

OK！