miiton.dev

幅広い知識と幅広いスキルを求められている系システムエンジニアです。リモートワークしかやりません。

超簡単！TypeScriptでyarn(npm) add(install)できるモジュールを作る方法

alexjoverm/typescript-library-starter: Starter kit with zero-config for building a library in TypeScript, featuring RollupJS, Jest, Prettier, TSLint, Semantic Release, and more!

こちらを使うだけなんですが、ものすごく簡単でした。

手順

README の Usage 通りですが、yarn に置き換えて書きます

クローンとインストール

git clone https://github.com/alexjoverm/typescript-library-starter.git hogehogejs
cd hogehogejs
yarn install

yarn install を実行すると、

Hi! I'm setting things up for you!!

 Removed .git directory


Removed files: tools/init.ts,.all-contributorsrc,.gitattributes

Enter your library name (use kebab-case):

というメッセージが出てくるので、ライブラリ名を入力します。

Hi! I'm setting things up for you!!

 Removed .git directory


Removed files: tools/init.ts,.all-contributorsrc,.gitattributes

Enter your library name (use kebab-case):  hogehogejssrc/hogehogejs.ts,test/hogehogejs.test.ts renamed/Users/tmnm/dev/src/github.com/miiton/hogehogejs/package.json,/Users/tmnm/dev/src/github.com/miiton/hogehogejs/rollup.config.js,/Users/tmnm/dev/src/github.com/miiton/hogehogejs/LICENSE,/Users/tmnm/dev/src/github.com/miiton/hogehogejs/test/library.test.ts,/Users/tmnm/dev/src/github.com/miiton/hogehogejs/tools/gh-pages-publish.ts updatedInitialized empty Git repository in /Users/tmnm/dev/src/github.com/miiton/hogehogejs/.git/Git initializedRemoved postinstall scriptHappy coding!! ;)huskysetting up Git hooksdone✨  Done in 71.76s.

インストール完了！

コードを書く

src/hogehoge.ts というファイルができているので、これを起点にコードを書いていきます。

ビルドする

yarn build

これで、 dist/ に以下のファイルができます

docs/
hogehogejs.es5.js
hogehogejs.es5.js.map
hogehogejs.umd.js
hogehogejs.umd.js.map
types/

commit して GitHub に push する

の前に、.gitignore の dist の記述を消してから add して commit して push します。

以上！

これで

yarn add https://github.com/USERNAME/hogehogejs

が出来るモジュールができました。超簡単ですね。すごい！

この手順で作ったプライベートユースなライブラリ : miiton/jptelformatter

© 2023 @miiton