React Logger Checker

Table of Contents

• Introduction
• Features
• Global Installation
  • NPM - Global
  • Yarn - Global
• Local Installation
  • NPM - Local
  • Yarn - Local
• Usage
• Instructions
• Authors
• Github

Introduction

React Logger Checker is a Node.js CLI utility designed to identify console.log statements in your React codebase. It's perfect for developers who wish to clean up their code before production and maintain a cleaner, more performant application.

:warning: Keep your console clean: It's a best practice to remove console.log statements from production code to improve performance and security!

Features

• Scans .js, .jsx, .ts, .tsx files for any console.log statements
• Color-coded console warnings
• Line numbers and clickable file paths for quick navigation
• Ignores commented out console.log statements
• Ignores console.log statements inside try/catch blocks
• Allows ignoring specific console.log statements with the comment // @ignore-console-log-warning-next-line

Global Installation

You can add React Logger Checker to your project via npm or Yarn.

NPM

To install the package globally using npm, run:

npm install -g react-logger-checker

Yarn

To install the package globally using Yarn, run:

yarn global add react-logger-checker

Usage

If you've installed the package globally, you can run it from any directory by executing the react-logger-checker command in your terminal:

react-logger-checker

Local Installation

If you prefer a project-specific installation, you can install it as a dev dependency:

NPM

To install the package locally using npm, run:

npm install --save-dev react-logger-checker

Yarn

To install the package locally using Yarn, run:

yarn add --dev react-logger-checker

After installing, add a script in your package.json to run the checker:

"scripts": {
  "check-logs": "react-logger-checker"
}

Then run the script using:

npm run check-logs

or

yarn check-logs

Instructions

Byd default this will scan all .js, .jsx, .ts, and .tsx files within the src directory and display any console.log statements found.

Ignoring Specific console.log Statements

To ignore a specific console.log statement, place the comment // @ignore-console-log-warning-next-line on the line directly above the console.log you wish to ignore.

For example:

// @ignore-console-log-warning-next-line
console.log("This log will be ignored by the checker.");

Specifying a Custom Folder

You can specify a custom folder to check by adding it as an argument to the command:

npm run check-logs frontend

or

yarn check-logs frontend/components

This will then scan the specified folder for any console.log statements.

Authors

• Sanel Babij

Github

Github link