LoginSignup
2
5

More than 1 year has passed since last update.

GitHub Packages で社内向けライブラリを作る💪

Last updated at Posted at 2023-01-19

やりたいこと

GitHub Packages を使って社内向けのライブラリを作成して、npm のパッケージとして公開する💪
TypeScriptを使用しています。

この記事ではnpmに公開するまでを対象としています。
ライブラリを使う方法は以下記事で書いているのでよかったら見てみてください🤗

やること一覧

  1. package.json を設定する
  2. tsconfig.json を設定する
  3. 関数を作成する
  4. GitHub Actions を設定する
  5. リリースを作成する

Package.json を設定する

今回やりたいことと関係ない部分は省略しています。

package.json
{
  "name": "@{GitHubのOrganization名}/{リポジトリ名}",
  "version": "1.0.0",
  "description": "自作ライブラリ",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "publishConfig": {
    "access": "restricted",
    "registry": "https://npm.pkg.github.com/"
  },
  "repository": {
    "type": "git",
    "url": "git://github.com/{@GitHubのOrganization名}/{リポジトリ名.git}"
  },
  "author": "",
  "license": "UNLICENSED",
  "devDependencies": {
   "typescript": "^4.9.4"
 }
}

重要な箇所だけ説明します。

name
@{GitHubのOrganization名}/{リポジトリ名} のように設定します。
ライブラリをインストールする際に以下のように使用します。

$ npm install @{GitHubのOrganization名}/{リポジトリ名}

types

ライブラリに型定義ファイルを含める場合は types を設定します。

publishConfig

パッケージを公開するレジストリを指定できます。
"access": "restricted" で private なパッケージになります。

repository

GitHub リポジトリの URL と一致している必要があります。

tsconfig.json を設定する

{
  "compilerOptions": {
    "target": "es5",
    "module": "esnext",
    "declaration": true,
    "sourceMap": false,
    "outDir": "./dist/",
    "strict": true,
    "moduleResolution": "node",
    "esModuleInterop": true
  },
  "exclude": ["node_modules", "dist"],
  "include": ["src"]
}

上記だと ES Modules にしか対応していないので、CommonJS にも対応したい場合は以下の記事を参考にしていただければと思います。

関数を作成する

index.ts は関数をエクスポートするだけにしました。

index.ts
export { func } from './features/filename';

GitHub Actions を設定する

リリース作成時に自動でトランスパイルして、Packageとして公開するようにします。
.github/workflows/publish.yml を作成します。

publish.yml
name: npm publish
on:
  release:
    types: [published]
jobs:
  publish-gpr:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      packages: write
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: 16
          registry-url: 'https://npm.pkg.github.com'
          scope: '@{GitHubのOrganization名}'
      - run: |
          npm ci
          npm run build
          npm publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

secrets.GITHUB_TOKEN はリポジトリに元々備わっているものなので設定は必要ありません。

リリースを作成する

GitHub でリリースを作成して、パッケージが npm に公開されるか確認しましょう。
リリースの作成方法は以下をご参照ください。

感想

GitHub Packages は導入コストが低いので便利だなと感じました。
これまで複数箇所に同じ処理が書かれていてヤキモキしていたので、ライブラリとして管理できるのがとっても楽しみです🤗

参考

2
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
5