以下を読んだメモ。
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://docs.npmjs.com/favicon-32x32.png?v=c2963dcad859b2b320d26051c38197fe" />
<span class="link-card-v2-site-name">docs.npmjs.com</span>
</div>
<div class="link-card-v2-title">
npm Docs
</div>
<div class="link-card-v2-content">
Documentation for the npm registry, website, and command-line interface
</div>
<img class="link-card-v2-image" src="https://user-images.githubusercontent.com/29712634/81721690-e2fb5d80-9445-11ea-8602-4b2294c964f3.png" />
<a href="https://docs.npmjs.com/"></a>
</div>
読んだ箇所で必要だと感じたことのみのラフなメモ。
# About npm
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://docs.npmjs.com/favicon-32x32.png?v=c2963dcad859b2b320d26051c38197fe" />
<span class="link-card-v2-site-name">docs.npmjs.com</span>
</div>
<div class="link-card-v2-title">
About npm | npm Docs
</div>
<div class="link-card-v2-content">
Documentation for the npm registry, website, and command-line interface
</div>
<img class="link-card-v2-image" src="https://user-images.githubusercontent.com/29712634/81721690-e2fb5d80-9445-11ea-8602-4b2294c964f3.png" />
<a href="https://docs.npmjs.com/about-npm"></a>
</div>
[[npm]]は以下3つから構成されている。
- ウェブサイト
- [[CLI]]
- レジストリ
アカウント作成は https://www.npmjs.com/signup から。
## Getting started
アカウントは[[🦉Owlelia]]をアップロードするときに作成済なのでログインする
## Sharing packages and collaborating with others
- 公開パッケージは無料だが、それ以外は有料ぽい
- [[GitHub Packages]]や[[Verdaccio]]を使えば完全プライベートな管理も可能
# Getting started
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://docs.npmjs.com/favicon-32x32.png?v=c2963dcad859b2b320d26051c38197fe" />
<span class="link-card-v2-site-name">docs.npmjs.com</span>
</div>
<div class="link-card-v2-title">
Getting started | npm Docs
</div>
<div class="link-card-v2-content">
Documentation for the npm registry, website, and command-line interface
</div>
<img class="link-card-v2-image" src="https://user-images.githubusercontent.com/29712634/81721690-e2fb5d80-9445-11ea-8602-4b2294c964f3.png" />
<a href="https://docs.npmjs.com/getting-started"></a>
</div>
- [[Node.js]]や[[npm]]のインストールは[[nvm]]が推奨
- [[Windows]]の場合はそれ以外の選択肢
- 個人的には[[Volta]]を使っているが、ここには言及されていなかった...
- 参考: [[複数のNode.jsバージョンを使い分け]]
# Packages and modules
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://docs.npmjs.com/favicon-32x32.png?v=c2963dcad859b2b320d26051c38197fe" />
<span class="link-card-v2-site-name">docs.npmjs.com</span>
</div>
<div class="link-card-v2-title">
Packages and modules | npm Docs
</div>
<div class="link-card-v2-content">
Documentation for the npm registry, website, and command-line interface
</div>
<img class="link-card-v2-image" src="https://user-images.githubusercontent.com/29712634/81721690-e2fb5d80-9445-11ea-8602-4b2294c964f3.png" />
<a href="https://docs.npmjs.com/packages-and-modules"></a>
</div>
- [[パッケージ (npm)|パッケージ]]と[[モジュール (npm)|モジュール]]の違い
- [[パッケージ (npm)|パッケージ]]
- [[package.json]]に記載されたもので、ファイルかディレクトリ
- [[package.json]]を含まなければならない
- [[モジュール (npm)|モジュール]]
- [[node_modules]]ディレクトリ内のファイル/ディレクトリで、`require()`関数にて[[Node.js]]から読み込めるもの
- 以下のいずれかである必要がある
- `main`フィールドを含む[[package.json]]
- [[JavaScript]]ファイル
- [[package.json]]を持っている[[モジュール (npm)|モジュール]]だけが[[パッケージ (npm)|パッケージ]]
- [[スコープ (npm)|スコープ]]
- [[Scoped packages]]
- [[Unscoped packages]]
## Contributing packages to the registry
ここからは[[パッケージ (npm)|パッケージ]]を作成するフェーズ。
### [[package.json]]の作成
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://docs.npmjs.com/favicon-32x32.png?v=c2963dcad859b2b320d26051c38197fe" />
<span class="link-card-v2-site-name">docs.npmjs.com</span>
</div>
<div class="link-card-v2-title">
Creating a package.json file | npm Docs
</div>
<div class="link-card-v2-content">
Documentation for the npm registry, website, and command-line interface
</div>
<img class="link-card-v2-image" src="https://user-images.githubusercontent.com/29712634/81721690-e2fb5d80-9445-11ea-8602-4b2294c964f3.png" />
<a href="https://docs.npmjs.com/creating-a-package-json-file"></a>
</div>
- [[package.json]]は[[npm init]]コマンドで作成する
- `name`と`version`は必須
- `name`は小文字のアルファベットで、ハイフンやアンダースコアを利用できる
- `version`は[[セマンティックバージョニング]]に従う
```console
mkdir mimizou-libtest
cd mimizou-libtest
npm init -y
```
```json
// package.json
{
"name": "mimizou-libtest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
```
==ノートはここまで==
続きは [[📜TypeScriptのnpmパッケージを作成してみる]] に書くことにした。
> [!question] Why?
> [[TypeScript]]の[[npmパッケージ]]を作成したいので、本稿とは少し異なるため。