Create React Appの安全なインストール方法

Question

前提・実現したいこと

Windows環境で、reactの環境構築、Create React Appのインストール方法について考えています。
「react インストール」で検索すると、このような記事などが見つかり、
npmでのインストール方法が説明されていますが、

npm install -g create-react-app

npmは脆弱性があってあまりよくないイメージがあるのですが(間違っていたらご指摘お願います)、
npmでcreate-react-appをインストールするのは大丈夫なのでしょうか？
create-react-appを安全にインストールする方法のご教示をお願いします。

試したこと

Yarnでインストールする方法も見つけました。

yarn global add create-react-app

また、reactの公式サイトでは、
npxでインストールする方法が掲載されていました。

npx create-react-app my-app

npxもnpmの一種みたいなのですが、大丈夫でしょうか？
npxについて調べてみると、「ローカルのnpmパッケージを使用する」という説明が書かれていましたが、

npx create-react-app my-app

とした場合、既存のローカルのnpmからcreate-react-appをインストールするということでしょうか？
(デフォルトのnpmにcreate-react-appが入っているということでしょうか？)

補足情報（FW/ツールのバージョンなど）

Windows 10

Comments

[thyda.eiqau]

リンク先の記事を読みましたが、「yarnをインストールするためにnpmを使うな」という論旨は読み取れましたが、npmには脆弱性があるから使うべきではないとは一言も書いていないように思います。何をもってそう判断されたのですか？

Answer 1

残念ながら、npmにも、create-react-appにも、yarnにも、脆弱性が一切ないという保証はありません。
もし脆弱性を見つけたら修正してプルリクエストを出してください。

もし心配で、かつ既存のライブラリよりも正確にコードを書ける自信があるのであれば、ライブラリは使わずに全て自作するのがよいかと思います。
ただ、実際にはそんなことは現実的ではない（やってやれないことはないが、車輪の再開発に割くコストは無い）場合がほとんどだと思いますので、脆弱性が紛れ込んでいる可能性があることを理解して、ライブラリを使うことになるかと思います。その場合、脆弱性への対策としては常に最新動向を探って、アップデートが必要ならアップデートする、致命的な欠陥が見つかったら使うのをやめて代替手段を探す、という対処療法です。

ただ、最新動向を探ると言ってもそれはそれで大変です。私は過去、webpackのバグでハマったことがあり、その名残で、挙げられている3点の中だとnpmを今もGitHubでWatch Releaseしていますが、かなり高頻度で通知が飛んできてウザいしすべての変更内容を毎回読むのは無理です（というかここ数年で2,3回しか真剣にチェックしてない）ので、ご自身の中で、あるいはご自身のチームの中で割けるリソースの度合いに応じて割り切ってやっていくしかないです。

create-react-appのインストール自体はnpmでもyarnでも好きな方を使えばよいと思いますが、npmを使う場合、npm install -gはもう古いので、npxにしてください。

Comments

[退会済みユーザー]

ご回答ありがとうございます。
やはり、npmか、yarnか、npxのいずれかの方法しかないですよね。
脆弱性に関しても言及していただきありがとうございます。
npxでインストールしようと思います。

Answer 2

npxもnpmの一種みたいなのですが、大丈夫でしょうか？

Reactの公式サイトに書いてあるように npx を使って大丈夫です。npx は npm のバージョン5.2から npm に同梱されています。

既存のローカルのnpmからcreate-react-appをインストールするということでしょうか？

「ローカルのnpmパッケージを使用する」についてどのウェブサイトを参考にしたのかはわかりませんが、package.jsonのdependencies/devDependenciesにnpxで実行するコマンドのパッケージが記載されている場合、そちらのnpmパッケージを使用する、という意味です。指定がなかった場合キャッシュから実行します。実行に必要なファイルは自動でインストールされます。

Executes <command> either from a local node_modules/.bin, or from a central cache, installing any packages needed in order for <command> to run.

https://www.npmjs.com/package/npx/v/5.2.0

package.json等にcreate-react-appの記載がない場合は最新のバージョンが実行されます。

% npx create-react-app --version
npx: 99個のパッケージを13.603秒でインストールしました。
3.4.0

通常のnpmのパッケージのインストールと同様 @ を使ってパッケージのバージョンを指定することができます。

% npx create-react-app@3.3.1 --version
npx: 99個のパッケージを13.742秒でインストールしました。
3.3.1

Comments

[退会済みユーザー]

ご回答ありがとうございます。
npxでインストールしようと思います。
パッケージのバージョン指定の方法もご教示くださりありがとうございます。