Linux上にyarnとnodenvで作るVue.jsの開発環境

Vue.jsは、ReactやAngularと同じく、オープンソースのJavaScriptフレームワークの一つ。ReactやAngularが、フルスタックフレームワーク志向なのに対し、Vue.jsは、主に、MVC(Model View Controller)モデルの View層（発音もViewとVueは同じ）を扱うことに特化（フルスタックフレームワークとして使うことも可能）しています。

このため、Ruby on RailsやLaravelなど、MVC型のWebフレームワークがVue.jsに熱い視線（温度差はあるでしょうが）を送っています。

ということで、さっそくVue.jsの開発環境をLinux（主にUbuntu 18.04 LTS）上に構築してみましょう。

nodenvのインストール
node-buildのインストール
Yarnのインストール
Vue CLIのインストール
JavaScriptフレームワークとVue.jsの今後

nodenvのインストール

Vue.jsの開発環境を構築するためには、先ずは、次の3つが必要となります。

最新のNode.js
JavaScriptのパッケージマネージャ（npm又はyarn）
Vue CLI

Node.jsは、最新のDebian/Ubuntu系のディストロにも、標準でインストールされていますが、バージョンが少々古いです。Node.jsの開発速度がとても早いため、あっという間にバージョンが古くなっていきます。

そこで、必要になるのが、Nodeのバージョン管理ツール。Nodeのバージョン管理ツールには、nodebrewを始めとして、複数の選択肢がありますが、そのなかでも、nodenvはRubyのrbenvから派生したツールということもあって、コマンドの使い方がほとんどいっしょという利点もあります。

インストールは、次のコマンドを順番に実行すれば完了します。

git clone https://github.com/nodenv/nodenv.git ~/.nodenv 
echo 'export PATH="$HOME/.nodenv/bin:$PATH"' >> ~/.bash_profile
echo 'eval "$(nodenv init -)"' >> ~/.bash_profile
source ~/.bash_profile

node-buildのインストール

続いて、nodenvのプラグインnode-buildをインストールします。Rubyでいうところのrbenvとruby-buildの関係（こう言われて分からなくても問題はありません）と同じで、指定したバージョンのNodeをインストールしたり、削除したりできるようになります。

node-buildは、次のコマンドでインストールできます。

git clone https://github.com/nodenv/node-build.git ~/.nodenv/plugins/node-build

インストールが完了したら、次のコマンドでインストール可能なNode.jsのバージョンを確認します。

nodenv install -l

現時点での最新版は、12.12.0ですから、先ずはこのバージョンをインストールして、これをデフォルトに設定します。

nodenv install 12.12.0
nodenv rehash
nodenv global 12.12.0

最後に、Node.jsのバージョンが12.12.0になっていることを確認しましょう。

node -v

ここまでところは、主にコチラ（この記事はMac向け）を参考にさせてもらいました。

Yarnのインストール

最新のNode.jsがインストールできれば、JavaScriptのパッケージマネージャのnpmが使えるようになります。

npmでもパッケージマネージャとして十分な機能を有していますが、今回は、npmよりさらに、高速、高機能を謳っているパッケージマネージャのyarnをインストールします。

yarnは、Debian/Ubuntu系のディストロの標準リポジトリにもありますが、こちらはバージョンが古いので、次のコマンドを順次実行し、最新版のyarnをインストールしましょう。

curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt update 
sudo apt install yarn

Manjaro LinuxなどのArch Linux系では、次のコマンドを実行します。