Chapter 03

プロジェクトの作成

manycicadas
manycicadas
2021.01.16に更新

ディレクトリの作成

今回作成するライブラリの全体を保管するためのディレクトリを作成します。
任意の場所に好きな名前で作成してください。

$ mkdir hello-js-lib
$ cd hello-js-lib

プロジェクトの初期化

作成してディレクトリに移動し、以下のコマンドを実行します。
括弧に記載されているデフォルト値以外を設定したい場所だけ適当に設定します。
後でいくらでも修正できるので、ここで悩む必要はありません。

$ yarn init
# question name (hello-js-lib): @cigalecigales/hellolib
# question version (1.0.0): 
# question description: This is a javascript sample library.
# question entry point (index.js): 
# question repository url: 
# question author: cigalecigales
# question license (MIT): 
# question private: 
# success Saved package.json
# ✨  Done in 45.54s.

するとプロジェクト内にpackage.jsonをいうファイルができると思います。

{
  "name": "@cigalecigales/hellolib",
  "version": "1.0.0",
  "description": "This is a javascript sample library.",
  "main": "index.js",
  "author": "cigalecigales",
  "license": "MIT"
}
  • name ・・・ ライブラリの名前
  • version ・・・ ライブラリのバージョン
  • description ・・・ 説明
  • main ・・・ エントリポイントとなるファイル(これはまた後ほど解説の上、変更します)
  • author ・・・ 作者の名前
  • license ・・・ ライセンス

各種ディレクトリの作成

今回のライブラリ作成では、srcディレクトリにライブラリの中身を実装し、testディレクトリにテストコードを格納することにしたいと思います。
なので、プロジェクト内にsrctestの2つのディレクトリを作成しましょう。

$ mkdir src
$ mkdir test

.gitignoreの作成

最終的にはGithubに公開しますが、そのときに公開したくないファイルまでコミットされたら困ります。
なので、予めコミットしたくないファイルを定義しておきましょう。
そろそろコマンドラインで作業するのも辛いので、VSCodeなど好きなエディタでプロジェクトを開いて操作しましょう。
.gitignoreというファイルをプロジェクト直下に作成し、以下のように記述します。

.DS_Store
node_modules

.editorconfigの作成

コーディングスタイルを統一するために設定を追加しましょう。
VSCodeを使用している場合は、EditorConfig for VS Code (拡張機能)を使用すると、プロジェクト右クリック > Generate .editorconfig」で自動生成することができます。 これはお好みのコーディングスタイルに変えられるので、もし変えたかったら変更してみてください。 私は以下としました。 例えば私はinsert_final_newlinetrue`を設定していますが、これを設定することでVSCodeでファイルを保存した際に自動的に最終行が空行で挿入されます。

# EditorConfig is awesome: https://EditorConfig.org

# top-most EditorConfig file
root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true