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 / PHPにて「lz-string」を用いてデータの圧縮・展開する方法
文字数が多いGETパラメータを送信したいというケースがあった。また、送信側はJa ...
-
-
横スクロール可能な要素を視覚的に分かりやすくする「ScrollHint」ライブラリの利用方法
横長のtableを設置し、CSSのoverflowで横スクロール可能にしてもユー ...
-
-
表示範囲を自由に変更可能な折れ線グラフが表示できるJSライブラリ amCharts の使用方法
どこかのサイトを閲覧していた際に、恐らくはJavaScriptのライブラリで描写 ...
-
-
画像にマウスを合わせると拡大表示させる「drift」ライブラリの利用方法
amazon等ECサイトで商品画像にマウスを合わせると当該部分が拡大表示されると ...
-
-
JavaScriptにて数値の書式設定と操作を行える「Numerical.js」ライブラリの利用方法
以前JavaScriptで数値のカンマ区切り化とカンマ区切りの解除を行う方法をメ ...