タグ

npmに関するhbKOTのブックマーク (20)

  • npm install と npm ci って結局どう使うの?2023年版 - Mitsuyuki.Shiiba

    うりうりさんの↓のコメントを見て、そういえばnpm ciって見たことあるけどチェックしてないなぁ。というかnpm installも雰囲気で使ってるなぁ。と思ったので、うりうりさんに教えてもらったことを手がかりに、npm installとnpm ciについて調べた。 これ、node_modulesキャッシュしてたり npm install使ってるけど npmのグローバルキャッシュ(~/.npm)をキャッシュした上で npm ciで早くなったりしないんだろうか GitHub Actions上でテストを約3倍早くした話https://t.co/MpmFktGBxU— wreulicke (@wreulicke) March 14, 2023 ちょこっと検索して見てみたところ、新旧情報があって自分が混乱したのと、公式ドキュメントには概要は書かれているものの詳しい内容は書かれていないので(僕が見つけ

    npm install と npm ci って結局どう使うの?2023年版 - Mitsuyuki.Shiiba
    hbKOT
    hbKOT 2023/09/13
  • npmgraph - NPM Dependency Diagrams

    Graph / visualize of npm dependencies

    npmgraph - NPM Dependency Diagrams
    hbKOT
    hbKOT 2023/08/14
  • npm installとnpm ciの動作確認を簡単にやっておいた - Mitsuyuki.Shiiba

    先週、npm installとnpm ciについて調べて考えたことを書いたのだけど、ドキュメントを読んで、頭の中で考えたことをまとめただけなので、これだけだとちょっと気持ち悪いなと思って。簡単ではあるけど実際の動作を確認することにした。 bufferings.hatenablog.com 結果 だいたい想像どおりだった。今回のサンプルプロジェクトで実験した結果は次のとおり。 (1)と(2)は、キャッシュがない場合のnpm ciとnpm installの速さ。想像では「npm ciの方が多少速いのかな?」と考えていたけどほぼ同じだった。node_modulesがない状態から始まるので、npm ciはnpm_modulesを削除する必要がない。一方で、npm installも既存のnode_modulesをチェックする必要がなくて、package.jsonとpackage-lock.jsonの

    npm installとnpm ciの動作確認を簡単にやっておいた - Mitsuyuki.Shiiba
    hbKOT
    hbKOT 2023/04/14
  • package-lock.json ってなに? - Qiita

    初心者に向けての答え package-lock.json について、とりあえず以下を守ればプロジェクトに迷惑をかけません。 直接編集してはいけません 基的に無視していいファイルです 削除してはいけません npm install コマンド実行時に変更されることもありますが、そのときに発生する変更は気にしなくて大丈夫です マージリクエスト(プルリクエスト)する際に package-lock.json に変更があった場合は、その変更も含めて提出します ※ これは package.json についても同じことが言えます。 もうちょっと知りたい人に向けての答え package-lock.json は npm install 実行時に新規作成・更新される package-lock.json には npm install で実際にインストールしたパッケージ情報が記載されている package-lock

    package-lock.json ってなに? - Qiita
    hbKOT
    hbKOT 2022/09/13
  • 雰囲気でパッケージマネージャーを作ろう

    概要 記事では、 npm や yarn などの、Node.js におけるパッケージマネージャーを自作することで、その仕組みや挙動の理解を深めようという取り組みを整理した記事になります。 想定読者は以下を満たす人です。 普段 npm や yarn などのパッケージマネージャを使用している package.json 内の dependencies devDependencies ぐらいはわかる npm リポジトリの構成や、パッケージインストールの仕組みとか全然わからんけど、興味がないこともない TypeScript のコードをまぁまぁ読み書きできる 筆者自身も上記のレベルのため、パッケージマネージャに詳しい方が見たら鼻で笑うレベルの内容でもあるので、どうぞお手柔らかにお願いします。 注意事項 記事ではソースコードを断片的に記載していますが、ハンズオン形式にはなっていないため、コードの全容に

    雰囲気でパッケージマネージャーを作ろう
    hbKOT
    hbKOT 2022/09/13
  • LernaとYarn WorkspacesでMonorepo管理 - Cybozu Inside Out | サイボウズエンジニアのブログ

    こんにちは、フロントエンドエキスパートチームの小林(@koba04)です。 記事では、Lerna と Yarn Workspaces を使った Monorepo 管理について解説します。 Monorepoとは 記事では、単一のリポジトリで複数のモジュールやパッケージ(今回の場合は npm パッケージ)を管理する手法を Monorepo と呼んでいます。 有名なところだと、Babel や Jest、Create React App などが後述する Lerna を使い複数パッケージを単一のリポジトリで管理しています。 他にも React も Lerna は使っていませんが単一リポジトリで複数パッケージを管理しています。 また、上記のようなライブラリ以外にも企業で利用している npm パッケージを Monorepo として管理している例もあります。下記は Shopify の例です。 pack

    LernaとYarn WorkspacesでMonorepo管理 - Cybozu Inside Out | サイボウズエンジニアのブログ
  • yarnをv1からv2(Berry)へ移行する

    yarnのv2(Berry)が登場してしばらく経ちましたが、依然v1を使い続けている方が多いかと思います。最近になってやっと問題なく移行できると判断できるようになってきたので、この度移行してみました。 yarn v1の問題点 散々各所で語られていると思いますが、簡単にyarnのv1の問題点をまとめてみます。 1. node_modulesのサイズが肥大化する 中規模程度のリポジトリでも 2GB を前後になるのは当たり前です。 そのためとにかく重いのと、Node.jsを使う複数のリポジトリで開発をしているとこの容量だけでマシンのディスク残量を消費するので マシンにも優しくありません。 2. yarn add や yarn removeを繰り返すと頻繁に壊れる yarn v1の一番の問題は恐らくこれです。 壊れるというのは具体的には依存関係の参照が整合性が取れなくなって、追加したコマンドの実行

    yarnをv1からv2(Berry)へ移行する
    hbKOT
    hbKOT 2021/08/02
  • npm や yarn のグローバルインストール先 - ノウハウブログ - カンタローCGI

    npm npm bin -g ※Windowsの例:C:\Users\(ユーザー名)\AppData\Roaming\npmLinuxの例:/usr/local/bin yarn yarn global bin ※Windowsの例:C:\Users\(ユーザー名)\AppData\Local\Yarn\bin ※Linuxの例:/usr/local/bin Windows10のPATH追加 上記のコマンドを実行して表示されたパスを環境変数 PATH に追加してログインし直せばOKです。 Windowsの場合、環境変数名の編集ツールで PATH に追加してください。 (Win キー押下後「環境変数」と入力、↲ キーで編集ウィンドウ出せます) 自動的にPATH通してくれても良さそうなもんなんですけどね・・。

  • オリジナルのJavaScriptライブラリを公開しよう

    オリジナルのJavaScriptライブラリを公開します! ライブラリの作り方よりかは、実際に公開する手順やCI/CDについて解説します。 【技術】 ・ JavaScript ・ Node.js ・ npm/yarn ・ Mocha ・ Chai ・ Git/GitHubGitHub Actions

    オリジナルのJavaScriptライブラリを公開しよう
  • yarn v2にまつわる誤解 | Wantedly Engineer Blog

    現在WantedlyではNode.jsのパッケージ管理にyarn v1を使っています。現在私は開発者体験の改善を目指してyarn v2への移行を検討しているのですが、その過程でyarn v2が誤解されがちだと感じるようになりました。そこで社内への情報提供も兼ねて、いくつか誤解されがちだと思われる点を紹介したいと思います。 (わかりやすさのためにyarn v2と呼んでいますが、 yarn v3以降も含みます。これらはメジャーバージョンアップではあるもののyarn v1→v2のようにアーキテクチャが刷新されるわけではないからです) ポイント1: yarnをv2にするのにPnPは必須ではないyarn PnPはyarn v2の目玉機能で、パッケージをnode_modules以下に展開せずに仮想化してロードできるようにするというものです。node_modulesの展開作業が不要になるほか、依存関係の

    yarn v2にまつわる誤解 | Wantedly Engineer Blog
    hbKOT
    hbKOT 2021/05/25
  • npm ERR! cb.apply is not a function

  • JSエコシステムぶらり探訪(4): npmとコマンドライン - Qiita

    前回に続きnpmの機能について扱います。今回はnpmとコマンドラインツールとの関わりを中心に見ていきます。 ←前 目次 次→ 注意: Windowsとそれ以外では、npmのフォルダ配置は異なります。Windowsでの挙動についてはnpm-foldersを参照してください。 グローバルインストール npmは通常、Node.jsの配布物に同梱されていますが、yarnは同梱されていません。yarnを使う場合は次のようなコマンドを実行します。 これによって以下のような効果が発生します。 $PREFIX/lib/node_modules/yarn 以下にyarnの中身がインストールされる。 $PREFIX/lib/node_modules/yarn/node_modules 以下にyarnの依存関係がインストールされる。 $PREFIX/bin にシンボリックリンク yarn, yarnpkg が生

    JSエコシステムぶらり探訪(4): npmとコマンドライン - Qiita
    hbKOT
    hbKOT 2020/10/27
  • JSエコシステムぶらり探訪(3): npmとyarnとnode_modules - Qiita

    前回はNode.js単独での機能に焦点をあてて説明しましたが、Node.jsはnpm/yarnなどのパッケージ管理システムと組み合わせて使うことが想定されています。稿ではライブラリの依存解決としての側面を中心に、npm/yarnの挙動を説明します。 ←前 目次 次→ モジュールからパッケージへ モジュールは、JavaScriptプログラムを複数のファイルに分割し、必要に応じてロードする仕組みでした。 (1ファイル = 1モジュール) 一方パッケージは、複数のモジュールファイルをまとめて1つの独立した単位として扱う仕組みです。パッケージというより大きなまとまりを作ることで、バージョン番号を付与し、パッケージをパッケージレジストリに登録し、依存管理をすることができるようになります。 Node.jsと package.json パッケージはおおよそ package.json の存在によって特徴

    JSエコシステムぶらり探訪(3): npmとyarnとnode_modules - Qiita
    hbKOT
    hbKOT 2020/10/06
  • Bundlephobia | Size of npm dependencies

    What does Bundlephobia do? JavaScript bloat is more real today than it ever was. Sites continuously get bigger as more (often redundant) libraries are thrown to solve new problems. Until of-course, the big rewrite happens. Bundlephobia lets you understand the performance cost ofnpm install ing a new npm package before it becomes a part of your bundle. Analyze size, compositions and exports Credits

    Bundlephobia | Size of npm dependencies
  • Minimal Blog

    宣伝: YouTubeで初心者向けの配信をしています。よかったら覗いていってね😉 概要あなたは普段、何気なく npm install を使っていることでしょう。 しかし、 npm install が何をしているのか、実は誤解している人も多いと思います。 記事のタイトルは釣りではないので、どんな時に npm install は問題を起こすのか、説明できない人は以下を読み進めてください。これは多くの開発者が無意識に無視している、とても重要な事項だと思っています。 なお、npm 4.x系以下の方は記事の対象ではありません。 追記: 強めに書きすぎて誤解を招く部分があったので何度か修正しています。 参考資料:npm installnpm ci npm はパッケージマネージャです。パッケージマネージャは、開発に必要なパッケージ(ライブラリとか、プラグインとか色々)を管理するためのツールです。全て

    hbKOT
    hbKOT 2020/07/02
  • npm パッケージを CLI ツールとして機能させる仕組みについて - 30歳からのプログラミング

    npm パッケージのなかには、CLI ツールとしての機能を持っているものがある。 ESLint や Mocha、Jest などは、多くの人が使っていると思う。 この記事では、それらのパッケージがどのようにして CLI ツールとして機能しているのか、その仕組みについて説明する。 動作確認に使った npm のバージョンは6.14.5。Yarn は1.22.4。 package.json の bin フィールド npm パッケージに CLI ツールとしての機能を持たせるためにはまず、package.jsonのbinフィールドでコマンド名とファイル名をマップさせる必要がある。 具体的な記述を見たほうが早いので、題材としてcowsayのv1.4.0をインストールする。 $ npm init -y $ npm i cowsay@1.4.0 node_modulesにcowsayがインストールされている

    npm パッケージを CLI ツールとして機能させる仕組みについて - 30歳からのプログラミング
    hbKOT
    hbKOT 2020/06/06
  • npm link で OSS 活動の効率を上げる - 30歳からのプログラミング

    npm にはlinkというコマンドが用意されており、これを使うことで npm パッケージの開発効率が上がる。 既存のパッケージに手を加えた際の動作確認にも使えるので、OSS 活動の効率も上がる。 この記事では、npm linkの仕組みと、それをどのように利用できるのかについて説明する。 動作確認に使った npm のバージョンは6.14.5。 Node.js のバージョンは12.17.0。これ以前のバージョンだと以下の動作確認でエラーが出るので注意。 サンプル用のパッケージとアプリを作る まずはパッケージを作成する。 my-package-dirというディレクトリを作り、そこに以下の内容のpackage.jsonを作成する。 { "name": "my-package", "type": "module", "main": "main.js" } そして、以下の内容のmain.jsを作る。

    npm link で OSS 活動の効率を上げる - 30歳からのプログラミング
    hbKOT
    hbKOT 2020/06/06
  • package.json の resolutions を使って依存パッケージのバージョンを指定する - 30歳からのプログラミング

    package.jsonのresolutionsフィールドを使うことで、依存ツリーの深い部分にあるパッケージのバージョンを固定することが可能になる。 現在のところ Yarn でのみ使える機能だが、サードパーティが公開しているライブラリを使うことで npm でも使えるようになる。 動作確認に使った npm のバージョンは6.14.5。Yarn は1.22.4。 後述するnpm-force-resolutionsについては、0.0.3を使っている。 npm や Yarn でパッケージをインストールすると、指定したパッケージだけでなく、そのパッケージが依存しているパッケージもインストールされる。 そうしてインストールされたパッケージが他のパッケージに依存していれば、そのパッケージもインストールされ、それが繰り返されていく。 この仕組みについては、以下の記事で詳しく触れた。 numb86-tech

    package.json の resolutions を使って依存パッケージのバージョンを指定する - 30歳からのプログラミング
    hbKOT
    hbKOT 2020/05/28
  • package.json やロックファイルによるパッケージの依存関係の管理 - 30歳からのプログラミング

    この記事では、npm installやnpm ciを実行したときにどのようにパッケージがインストールされるのか、依存パッケージにバージョンのコンフリクトが発生した際にどのように処理されるのか、などを見ていく。必要に応じて Yarn での挙動にも触れる。 動作確認に使った npm のバージョンは6.14.5。Yarn は1.22.4。 特に npm はバージョンによって動作が大きく異なるので、注意する。 package-lock.json によるバージョンの固定 package.jsonだけではインストールするパッケージのバージョンを固定できず、package-lock.json(Yarn の場合はyarn.lock)によってバージョンを固定する。 多くの人が知っている話ではあるが、重要な機能なので改めて触れておく。 package.jsonのdependenciesやdevDependen

    package.json やロックファイルによるパッケージの依存関係の管理 - 30歳からのプログラミング
    hbKOT
    hbKOT 2020/05/26
  • npm-scripts で使える便利モジュールたち - Qiita

    npm はパッケージ依存管理ツールであると同時に、便利なタスク・ランナーです。 体はごく基礎的な機能だけを持ち、npm が管理するパッケージと Shell の力を組み合わせてタスクを定義します。「npm-scripts で利用する CLI コマンドは npm で管理できる」という分かりやすさが気に入っています。 npm-scripts には以下の特徴があります。 多くのツールが CLI を持っているためにラッパープラグインが不要です。Gulp ラッパー プラグインは非公式であることも多く、メンテナンスが継続するか不安な場合があります。 簡潔です。Gulp で書くと数十行だった処理が数行になるなんてこともよくあります。 複雑なことをするには向いていないです。 環境変数の扱いに難があります。 この記事では、私が npm-scripts を書くときによく利用している便利ツールたちを紹介します。

    npm-scripts で使える便利モジュールたち - Qiita
    hbKOT
    hbKOT 2020/05/01
  • 1