やってみる

アウトプットすべく己を導くためのブログ。その試行錯誤すらたれ流す。

npmで複数の指定パッケージを一括インストールする方法(package.json)PostCSS実行エラー(Input Error: Must use --dir or --replace with multiple input files)

 npm initしたプロジェクトのコード一式をGitHubにアップロードしたい。けれどnpm installしてnode_modules/配下にインストールされたパッケージは重いので含めたくない。それでもリポジトリをクローンしたあと、必要なパッケージを一発でインストールしたい。そんなときはpackage.jsonファイルをGitHubにアップロードすればいい。

成果物

前提

やりたいこと

  • 前回PostCSS環境をつくったコードをGitHubにアップロードしたい
  • でも、npmでインストールしたパッケージは重すぎるため除外したい
  • でも、GitHubuリポジトリをクローンしたあと、一発で必要なパッケージをインストールできるようにしたい

 というのが今回の目的。これらをすべて満たすためにはどうしたらいいか?

結論

  1. package.jsonファイルをGitHubにアップロードする
  2. node_modules/.gitignoreファイルに書いてアップロードしないようにする
  3. アップロードしたリポジトリをクローンする
  4. そのディレクトリに移動する
  5. npm installする
  6. パッケージが全部インストールされる

やってみる

 上記手順でアップロードしたリポジトリが以下である。リンク先をみてのとおりnode_modules/がない。

 こいつをクローンする。

git clone https://github.com/ytyaru/Node.PostCSS.HelloWorld.20220404175129

 READMEに沿ってプロジェクトディレクトリまで移動する。

cd Node.PostCSS.HelloWorld.20220404175129/src/hello-post-css

 以下コマンドで必要なパッケージをインストールする。PostCSSとその拡張がひとつインストールされる。ここが今日やりたかったところ!

npm install

 以下コマンドでCSSファイルを出力する。

pcss=./node_modules/.bin/postcss
input=./src/css
output./dst/css
$pcss $input -d $output

 あれ? なんかエラー出た。

Input Error: Must use --dir or --replace with multiple input files

 ファイルをひとつに絞ったらできました。でも標準出力されてしまい、ファイル出力されなかった。なんでや?

pcss=./node_modules/.bin/postcss
input=./src/css/style-var.css
output./dst/css/style-var.css
$pcss $input -o $output

 再現できないんですけど……。インストールはできていると思うのだが。なにがダメなんや?

所感

 わからん! 中等ハンパでモヤモヤする!

 でも、環境構築から道を踏み外してしまう。学習に戻れない。なので今はメモだけしておく。さあ次へ行こう。気持ちを切り替えよう。そうでなきゃいつまでたっても進めない。

 でも、苦手なんだよなぁ、気持ちの切替が。でも失敗ログを残しておけば忘れる心配がなくなる。そしてグチりまくればストレスもたまらなくなって後ろ髪をひかれるような思いが少しだけ軽くなる。そのためにこのブログで作業ログを残している。

 でも、だって、どうせ。それを否定されたら、なおさら不愉快になってしまう。なのでトコトンでも、だって、どうせと向き合う。自分が納得できるまで徹底的に追求する。そうすればスッキリする。私はね、君たちのように適当にすませたくないのだよ。私が納得できるような適当さかげんじゃなければ気になって次に進めないのだよ。妥協できない職人気質のダメ人間なのだよ。

 デンデロデンに粘着する〜♪ そいつが俺のやりかた〜♪

対象環境

$ uname -a
Linux raspberrypi 5.10.63-v7l+ #1496 SMP Wed Dec 1 15:58:56 GMT 2021 armv7l GNU/Linux