1. HOME
  2. »
  3. プログラミング・Web
  4. »
  5. パッケージマネージャー
  6. »
  7. Yarn の使い方。インストールの方法から使い方まで解説します。

Yarn の使い方。インストールの方法から使い方まで解説します。

最近ドラクエにはまっている@It_is_Rです。PS1 のやつです。ドラクエⅦ。

関係ない話はさておき、今回は Yarn の使い方を解説していきたいと思います。

目次
  1. Yarn とは
  2. Yarn をインストールする
  3. Yarn のバージョンを確認する
  4. package.json ファイルの作成(新しいプロジェクト開始)
  5. パッケージをインストールする
  6. パッケージのアップグレード
  7. パッケージをアンインストールする

Yarn とは

Yarn
Yarn

Yarn は JavaScript のパッケージマネージャです。 Facebook が、Exponent、Google、Tilde とコラボして公開しています。

Yarn をインストールする

では、早速インストールしていきましょう。
今回は Homebrew を使った方法を紹介します。
Homebrew を使ったことがない場合は Homebrewを使いこなせ!Macへのインストールや使い方。 をご覧ください。

インストールは下のコマンドをターミナルに入力します。

$ brew install yarn

Yarn のバージョンを確認する

Yarn のバージョンは、以下のコマンドで確認することができます。

$ yarn --version
1.2.1

もしくは

$ yarn -v
1.2.1

package.json ファイルの作成(新しいプロジェクト開始)

新しいプロジェクトを開始する場合は、 package.json ファイルを作成します。
package.json ファイルは、以下のコマンドで作成できます。

$ yarn init

必要な情報を入力します。(何も入力せずに、 Enter を押してしまっても構いません)

パッケージをインストールする

では、パッケージをインストールする方法を紹介します。

$ yarn add パッケージ名

例えば Bootstrap をインストールしたい場合は

$ yarn add bootstrap

となります。

パッケージのバージョンを指定する

パッケージのバージョンを指定したい場合は @ の後にバージョンを入力します。

$ yarn add パッケージ名@バージョン

例えば Bootstrap の 4.0.0-beta をインストールしたい場合は

$ yarn add bootstrap@v4.0.0-beta

となります。

依存関係

パッケージのインストールには、依存関係を示すオプションが使えます。

$ yarn add パッケージ名
$ yarn add パッケージ名 --dev
$ yarn add パッケージ名 --peer
$ yarn add パッケージ名 --optional

上記コマンドで、 package.json ファイルのそれぞれ
dependencies
devDependencies
peerDependencies
optionalDependencies
に登録されます。

package.json からインストールする

今までと環境が変わったなどの場合には、 package.json からパッケージをインストールすることができます。
cd コマンドで package.json と同じ階層へ移動し、以下のコマンドを実行します。

$ yarn install

もしくは

$ yarn

パッケージのアップグレード

upgradeコマンドで、パッケージをアップグレードすることができます。

$ yarn upgrade パッケージ名

また、バージョンを指定することもできます。

$ yarn upgrade パッケージ名@バージョン

例えば Bootstrap の 4.0.0-beta にアップグレードしたい場合は

$ yarn upgrade bootstrap@v4.0.0-beta

です。

パッケージをアンインストールする

以下のコマンドでパッケージをアンインストールできます。

$ yarn remove パッケージ名

例えば Bootstrap をアンインストールしたい場合

$ yarn remove bootstrap

となります。

スポンサードリンク

関連コンテンツ

オススメ記事

JavaScriptマンガ講座。初心者でも痛いほど理解できる変数の使い方。(実践編)

押入れが部屋になっている@It_is_Rです。 今回の記事はJavaScriptマンガ講座、2回目となりました。 この企画はJavaScriptをフザケまくって覚えようというものです。

zplug を使ってプラグインをインストール、管理する。

二つのことを同時にできない、@It_is_Rです。 今回はターミナルをかっこよくするシリーズ、第三回目です。 zplug を使って、プラグインをインストールする方法を紹介します。

wordpress

WordPress – デフォルトで用意されたショートコード一覧と使い方。

昔は WordPress の画面が真っ白になって、頭も真っ白になったこともありました。@It_is_Rです。 WordPress では、プラグインを使ったりしない限り、投稿記事のなかで php

マップ上をキャラが移動できるようにしよう!

【JavaScript】マップでキャラを動かせるようにしよう! 小学生からのプログラミング入門

小学生からのプログラミング講座《こうざ》、第11弾です。 前回は、JavaScriptでのマップの作り方を紹介《しょうかい》しました。しかし、まだマップを配置《はいち》しただけで、キャラクター

【Android Studio】開発したアプリの実機テストを行う方法。

どうも、頭がすっからかんの@It_is_Rです。 やかましいわ。 今回は Android Studio で実機テストする方法を紹介します。 これからアプリ開発をしていく上で必要不可欠な実機テ

【 Bootstrap 4 】全体的な機能の解説と、Alert の使い方。

頭がお花畑の@It_is_Rです。 今回からは Bootstrap 4 の使い方について、詳しく書いていこうと思います。 このシリーズの、前回の記事はこちらです。 Bootstrap 4 を

Scratchで じゃんけんゲームを作ろう!

Scratchでじゃんけんゲームを作ろう! 小学生からのプログラミング入門

こんにちは! 今日(きょう)もプログラミングのお勉強(べんきょう)をはじめていきますよ! 前回の「Scratchの使い方と、ゲーム作りの基礎知識を学ぼう!」では、Scratch(スクラッチ)っ

ショートコード

BEMによるCSS設計の方法を解説。命名規則から使い方まで。

完璧を求めすぎて、平均以下な@It_is_Rです。 CSSは比較的簡単なものですが、CSS設計をしっかりしておかなければ、余分なコードが多くなったり、後から修正が大変になったりしてこまることにな

キャラを決まった間隔ずつ動かすよ!

【JavaScript】キャラを決まった間隔ずつ動かす! 小学生からのプログラミング入門

小学生からのプログラミング入門講座《にゅうもんこうざ》、第8弾です。 前回は、キャラクターの画像《がぞう》をスムーズに動かす方法でしたが、スピードが速すぎたので、画像の移動間隔《いどうかんかく

WordPress | ツイート数やシェア数付きのSNSシェアボタンを自作しよう!

最近SNSシェアボタンを作り直した@It_is_Rです。 せっかく作ったんだから、シェアするのだよ、みんな。 そこで今回は、Twitter や Facebook、GooglePlus、はてな

コメントをどうぞ!(コメントは承認後に反映されます)

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です