skillup

技術ブログ

JavaScript

yarnコマンド

投稿日:

JSやフロント側のライブラリを使うときはnpmを使ってたんですが、2〜3年前ぐらいからyarnというコマンドも使われているので、ちょっと調査を。

yarnとは?

基本的にはnpmの上位互換と考えて良さげ。特徴として、以下のような点が挙げられる

  • package.jsonをそのまま使える、但しyarnのみでインストールした場合は独自のyarn.lockなるファイルも存在する
  • yarnの方が高速かつ、セキュリティレベルが高い
  • npmで使えたコマンドは基本的にyarnでも使える(でなければ上位互換ではない・・・)
  • node:8以上のパッケージにはyarnコマンドがディフォルトで入ってるっぽい

よく使いそうなコマンド

基本的にnpmで使っていたものを使うはずなので、npmコマンドの整理のもので使ったものを。

他に以下のリンクを参考に。

npmとyarnのコマンド早見表

npmとyarnとpnpmの違い2021

yarn init

package.jsonをディフォルトで生成するコマンド。

yarn install

package.jsonに記録されているライブラリをインストール

yarn add パッケージ名

パッケージのインストール。以下はオプション

-g

通常はカレントディレクトリ以下に有効だが、-gのオプションはグローバル(環境全体になる)にインストールされる。

-D

開発時のみ必要な場合はこのオプションが必要になる。

yarn remove パッケージ名

アンインストール。

yarn list –depth==0

カレントディレクトリのプロジェクトにインストールされているライブラリの一覧。–depth==0をつけないと再帰的処理が走るのでつけたほうが無難。-gをつけるとグローバル環境。

yarn -s run パッケージ名

インストールされたライブラリを実行する際に使用される。npxと近い処理

yarn run スクリプト

npm run devと同じ要領で使える。

というか、yarn以外にpnpmなんていうコマンドも出てくるようで・・・フロントエンドは技術の変遷が激しい・・

 

-JavaScript
-

執筆者:


comment

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

関連記事

no image

JavaScriptのcookieに関して

今までCookieの管理などはPHP側でやることが多かったのですが、JavaSciprtで実行することも可能です。 設定に関してはkey=value形式で突っ込めばOKです。 [crayon-656b …

no image

JavaScriptのthisについて

今回はJavaScriptのthisについて。 JavaScriptのthisの場合、呼び出し方によってthisの参照先が変わります。 4種類あるとされていますが、使われ方で分類すると私の場合、下記の …

no image

JSでの画面の金額集計

主に金額などを画面で計算するような請求関係のアプリを作っていますと、JSを駆使して集計作業をすることが多いのではないかと思います。 ようはテーブルみたいなものがあり、それを集計するようなパターンです。 …

no image

Angular概論 モジュール、コントローラー、スコープなど

Contents1 Angularインストール2 ソース2.1 モジュール、スコープとコントローラ2.1.1  モジュールとは2.1.2 コントローラーとは2.1.3 スコープとは3 参考リンク An …

no image

timepickerについて

日付を入力するときに直接、文字入力するのがメンドイことからカレンダーが表示されるプラグインを使っている人は多いでしょう。 私も日頃Datepickerというライブラリを使っています。が、このプラグイン …

アーカイブ