JavaScriptにて「loglevel」ライブラリを利用して環境及びレベルによりログを出し分けする方法
JavaScriptにて何らかの確認の際にconsole.logを使うことが多い。ただ、これを本番環境で出しっぱなしという訳にもいかないので、テスト・本番環境によってコメントアウトする必要が出てくるがこれが面倒くさい。「loglevel」ライブラリを使うことで解決できる模様。以下に利用方法をメモ。
loglevel
GitHub
https://github.com/pimterry/loglevel
CDN
CDNで使う場合は以下を記述する。
<script src="https://cdnjs.cloudflare.com/ajax/libs/loglevel/1.9.1/loglevel.min.js"></script>
異なるバージョンを使用したい場合は以下から探す。
https://cdnjs.com/libraries/loglevel
利用方法
ソースコード
<script src="https://cdnjs.cloudflare.com/ajax/libs/loglevel/1.9.1/loglevel.min.js"></script> <script> log.setLevel('debug'); const msg = 'ログメッセージ'; log.trace(msg); log.debug(msg); log.info(msg); log.warn(msg); log.error(msg); </script>
ログレベルの指定
log.setLevel()に引数でログレベルを指定することで、指定したレベル以下のものを出力できる。
上記ソースコードの場合だと、ログレベルがdebug以下(debug / info / warn / error)のものがコンソールログに出力される。
テスト環境の場合はログレベルをdebugに、本番環境の場合はerrorに指定することで出し分けが可能。
尚、errorすらも出力したくない場合はsilentを指定すること。
関連記事
-
-
JavaScriptの日時・時刻用ライブラリ「Day.js」の利用方法について
JavaScriptの日時・時刻用を取り扱う際、PHPと比べると(個人的には)使 ...
-
-
円形のプログレスバーをprogressbar.jsで実装する方法
円形のプログレスバーを実装したかった。CSSだったり画像を用いたりする方法もあっ ...
-
-
バニラJavaScript対応の日時ピッカー「Flatpickr」ライブラリの利用方法
サイト内に日時ピッカーを実装する場合、jQueryの「DateTimePicke ...
-
-
ページ内のスクロールバーを見やすく且つ異なるブラウザ間でも同じデザインにする「SimpleBar」ライブラリの利用方法
CSSのoverflowでスクロールバーを設置した際、ブラウザによってデザイン( ...
-
-
表示範囲を自由に変更可能な折れ線グラフが表示できるJSライブラリ amCharts の使用方法
どこかのサイトを閲覧していた際に、恐らくはJavaScriptのライブラリで描写 ...