### Install react-native-logs with npm Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Use this command to install the library using npm. ```sh npm install --save react-native-logs ``` -------------------------------- ### Install react-native-logs with expo Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Use this command to install the library with Expo. ```sh expo install react-native-logs ``` -------------------------------- ### Install react-native-logs with yarn Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Use this command to install the library using yarn. ```sh yarn add react-native-logs ``` -------------------------------- ### Global Logger Setup in React Native Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Initialize a global logger in a `config.js` file for easy import across your application. This example demonstrates setting up transports, severity levels, and color options. ```javascript //config.js import { logger, consoleTransport, fileAsyncTransport, } from "react-native-logs"; import RNFS from "react-native-fs"; var LOG = logger.createLogger({ transport: __DEV__ ? consoleTransport : fileAsyncTransport, severity: __DEV__ ? "debug" : "error", transportOptions: { colors: { info: "blueBright", warn: "yellowBright", error: "redBright", }, FS: RNFS, }, }); export { LOG }; ``` ```javascript //index.js and other app files import { LOG } from "./config"; LOG.info("app log test"); ``` ```javascript //root.js import { LOG } from "./config"; var log = LOG.extend("ROOT"); log.info("root log test"); ``` ```javascript //root2.js import { LOG } from "./config"; var log = LOG.extend("ROOT"); log.info("root log test"); ``` ```javascript //home.js import { LOG } from "./config"; var log = LOG.extend("HOME"); log.info("home log test"); ``` -------------------------------- ### Quick Start: Create and Use a Logger Source: https://github.com/mowispace/react-native-logs/blob/master/README.md This snippet demonstrates how to create a default logger and log messages at different severity levels (debug, info, warn, error). The default logger uses the console transport. ```javascript import { logger } from "react-native-logs"; var log = logger.createLogger(); log.debug("This is a Debug log"); log.info("This is an Info log"); log.warn("This is a Warning log"); log.error("This is an Error log"); ``` -------------------------------- ### Create a Fully Configured Logger Instance Source: https://context7.com/mowispace/react-native-logs/llms.txt Use `logger.createLogger` to set up a logger with custom levels, severity, transports, and formatting options. This example demonstrates configuring console output with specific colors and enabling asynchronous logging. ```typescript import { logger, consoleTransport } from "react-native-logs"; // Fully configured logger (TypeScript infers level methods from the levels object) const log = logger.createLogger({ levels: { trace: 0, debug: 1, info: 2, warn: 3, error: 4, }, severity: "debug", // Minimum level to display transport: consoleTransport, transportOptions: { colors: { trace: "grey", debug: "cyan", info: "blueBright", warn: "yellowBright", error: "redBright", }, }, async: true, // Defer via requestIdleCallback / setTimeout dateFormat: "iso", // "time" | "local" | "utc" | "iso" | (date) => string printLevel: true, printDate: true, fixedExtLvlLength: true, // Pad level/extension names for column alignment enabled: true, }); log.trace("Starting up"); log.debug("Loaded config", { endpoint: "https://api.example.com" }); log.info("User authenticated", { userId: 42 }); log.warn("Retry attempt", { attempt: 2 }); log.error("Request failed", new Error("Network timeout")); // Output: "2024-01-15T10:23:45.123Z | TRACE : Starting up" // "2024-01-15T10:23:45.124Z | DEBUG : Loaded config \n{ \"endpoint\": ... }\n" ``` -------------------------------- ### Using Multiple Transports Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Configure the logger to use multiple transports simultaneously by passing an array of transport functions. This example includes console, file, Sentry, Crashlytics, and a custom transport. ```javascript import { logger, consoleTransport, fileAsyncTransport, sentryTransport, crashlyticsTransport, transportFunctionType, } from "react-native-logs"; import RNFS from "react-native-fs"; import * as Sentry from "@sentry/react-native"; import crashlytics from "@react-native-firebase/crashlytics"; const crashlyticsModule = crashlytics(); var customTransport: transportFunctionType = (props) => { // Do here whatever you want with the log message // Eg. a console log: console.log(props.level.text, props.msg) }; const log = logger.createLogger({ transport: [ consoleTransport, fileAsyncTransport, sentryTransport, crashlyticsTransport, customTransport, ], transportOptions: { FS: RNFS, SENTRY: Sentry, CRASHLYTICS: crashlyticsModule, colors: { info: "blueBright", warn: "yellowBright", error: "redBright", }, }, }); ``` -------------------------------- ### Crashlytics Transport Example Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Demonstrates how to configure and use the crashlyticsTransport to send logs to Firebase Crashlytics. ```APIDOC ## Crashlytics Transport Example ### Description This example shows how to set up the `crashlyticsTransport` to send specific log levels to Firebase Crashlytics. ### Method `logger.createLogger` with `transport: crashlyticsTransport` ### Configuration Options - `transport`: `crashlyticsTransport` - `transportOptions.CRASHLYTICS`: Instance of `@react-native-firebase/crashlytics` - `transportOptions.errorLevels`: String specifying which log levels to send as errors (e.g., "error") ### Request Example ```javascript import { logger, crashlyticsTransport } from "react-native-logs"; import crashlytics from "@react-native-firebase/crashlytics"; var log = logger.createLogger({ transport: crashlyticsTransport, transportOptions: { CRASHLYTICS: crashlytics(), errorLevels: "error", }, }); log.warn("Send this log to Crashlytics as log message"); log.error("Send this log to Crashlytics as non-fatal error"); ``` ``` -------------------------------- ### TypeScript Level Typing Example Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Demonstrates how TypeScript enforces log level types based on the logger configuration. Ensure 'logger' is imported from 'react-native-logs'. ```typescript import { logger } from "react-native-logs"; var log = logger.createLogger({ levels: { trace: 0, info: 1, error: 2, }, }); log.trace("message"); // correct log call log.silly("message"); // typescript error, "silly" method does not exist ``` -------------------------------- ### Send Logs to Crashlytics Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Configure and send logs to Firebase Crashlytics. Ensure '@react-native-firebase/crashlytics' is installed and configured. ```javascript import { logger, crashlyticsTransport } from "react-native-logs"; import crashlytics from "@react-native-firebase/crashlytics"; var log = logger.createLogger({ transport: crashlyticsTransport, transportOptions: { CRASHLYTICS: crashlytics(), errorLevels: "error", }, }); log.warn("Send this log to Crashlytics as log message"); log.error("Send this log to Crashlytics as non-fatal error"); ``` -------------------------------- ### Conditional Logging in Development Mode Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Configure logs to only appear in development mode using the `__DEV__` global variable. This setup uses `consoleTransport` in development and `fileAsyncTransport` in production, adjusting severity accordingly. ```javascript import { logger, consoleTransport, fileAsyncTransport, } from "react-native-logs"; import RNFS from "react-native-fs"; const config = { transport: __DEV__ ? consoleTransport : fileAsyncTransport, severity: __DEV__ ? "debug" : "error", transportOptions: { colors FS: RNFS, }, }; var log = logger.createLogger(); ``` -------------------------------- ### Get Original Console Object Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Retrieve the original console object if it was replaced by 'patchConsole'. This allows direct use of standard console methods. ```javascript var originalConsole = log.getOriginalConsole(); originalConsole.log("This will use the standard console.log"); ``` -------------------------------- ### Set and Get Log Severity Level Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Control which log messages are displayed by setting the minimum severity level. 'setSeverity' overwrites the initial configuration. ```javascript var log = logger.createLogger(); log.setSeverity("info"); log.debug("This log will not be printed"); log.info("This log will be printed correctly"); log.error("This log will be printed correctly"); ``` ```javascript var log = logger.createLogger(); var defaultseverity = log.getSeverity(); // severity = debug log.setSeverity("info"); var severity = log.getSeverity(); // severity = info log.setSeverity("error"); var newseverity = log.getSeverity(); // newseverity = error ``` -------------------------------- ### Custom `formatFunc` for JSON Output Source: https://context7.com/mowispace/react-native-logs/llms.txt Use `formatFunc` to define a completely custom log message format. This example creates JSON lines, suitable for log aggregation systems. Ensure the `transport` is set to `consoleTransport` or another suitable transport. ```typescript import { logger, consoleTransport } from "react-native-logs"; const log = logger.createLogger({ transport: consoleTransport, // Fully custom format: JSON lines for log aggregation formatFunc: (level, extension, msgs) => { const combined = Array.isArray(msgs) ? msgs.map((m) => (typeof m === "object" ? JSON.stringify(m) : String(m))).join(" ") : String(msgs); return JSON.stringify({ ts: new Date().toISOString(), lvl: level, ns: extension ?? undefined, msg: combined, }); }, // Or, keep default format but customize value serialization: // stringifyFunc: (val) => (val instanceof Error ? val.stack ?? val.message : JSON.stringify(val)), }); log.info("User signed in", { userId: 7, plan: "pro" }); // Output: {"ts":"2024-01-15T10:00:00.000Z","lvl":"info","msg":"User signed in {\"userId\":7,\"plan\":\"pro\"}"} const apiLog = log.extend("API"); apiLog.error("Rate limited", { retryAfter: 30 }); // Output: {"ts":"...","lvl":"error","ns":"API","msg":"Rate limited {\"retryAfter\":30}"} ``` -------------------------------- ### Sentry Transport for react-native-logs Source: https://context7.com/mowispace/react-native-logs/llms.txt Forwards log messages to a Sentry instance. Levels in `errorLevels` are sent as captured exceptions; others are breadcrumbs. Requires `@sentry/react-native` to be installed and initialized separately. ```typescript import { logger, sentryTransport } from "react-native-logs"; import * as Sentry from "@sentry/react-native"; Sentry.init({ dsn: "https://your-dsn@sentry.io/project-id" }); const log = logger.createLogger({ severity: "info", transport: sentryTransport, transportOptions: { SENTRY: Sentry, errorLevels: ["error", "fatal"], // or a single string: "error" }, }); log.info("Payment flow started"); // → Sentry breadcrumb log.warn("Slow network detected"); // → Sentry breadcrumb log.error("Payment gateway unreachable"); // → Sentry captureException ``` -------------------------------- ### Custom Transport Function for react-native-logs Source: https://context7.com/mowispace/react-native-logs/llms.txt Implement a custom transport function that matches `transportFunctionType`. It receives formatted message, raw message, level, extension, and options. This example sends logs to a remote endpoint via fetch. ```typescript import { logger, transportFunctionType } from "react-native-logs"; interface RemoteLogOptions { endpoint: string; appVersion: string; } const remoteTransport: transportFunctionType = (props) => { if (!props.options?.endpoint) return; fetch(props.options.endpoint, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ level: props.level.text, severity: props.level.severity, message: props.msg, raw: props.rawMsg, namespace: props.extension ?? "root", appVersion: props.options.appVersion, timestamp: new Date().toISOString(), }), }).catch(console.error); }; const log = logger.createLogger({ transport: remoteTransport, transportOptions: { endpoint: "https://logs.example.com/ingest", appVersion: "3.2.1", }, }); log.error("Unexpected state", { screen: "Cart", userId: 42 }); // POSTs: { level: "error", severity: 3, message: "...", namespace: "root", ... } ``` -------------------------------- ### Use Map Console Transport Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Import and use the `mapConsoleTransport` preset. This transport allows mapping log levels to specific console methods. ```javascript import { logger, mapConsoleTransport } from "react-native-logs"; var log = logger.createLogger({ transport: mapConsoleTransport, }); log.debug("Debug message"); ``` -------------------------------- ### Extensions (Namespaced Loggers) Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Illustrates how to create and use namespaced loggers to selectively enable logging for different parts of your application. ```APIDOC ## Extensions (Namespaced Loggers) ### Description Extend the logger to different namespaces for granular control over logging. Extensions can be enabled via configuration or dynamic methods. ### Method `logger.extend(namespace)` ### Configuration Options - `enabledExtensions`: Array of strings specifying which extensions are enabled by default (e.g., `["ROOT", "HOME"]`) ### Request Example ```javascript import { logger, consoleTransport } from "react-native-logs"; var log = logger.createLogger({ transport: consoleTransport, enabledExtensions: ["ROOT", "HOME"], }); var rootLog = log.extend("ROOT"); var homeLog = log.extend("HOME"); var profileLog = log.extend("PROFILE"); log.debug("print this"); // Prints with default namespace rootLog.debug("print this"); // Prints with ROOT namespace homeLog.debug("print this"); // Prints with HOME namespace profileLog.debug("not print this"); // Does not print as PROFILE is not enabled ``` ``` -------------------------------- ### getExtensions Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Retrieves an array of all currently created logger extensions. ```APIDOC ## getExtensions ### Description Get an array of currently created extensions. ### Method `log.getExtensions()` ### Returns - `Array`: An array containing the names of the currently created extensions. ``` -------------------------------- ### Configure Console Transport Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Set up the default console transport with custom log level mapping. This is useful for debugging and development. ```javascript import { logger, mapConsoleTransport } from "react-native-logs"; var log = logger.createLogger({ levels: { debug: 0, info: 1, warn: 2, err: 3, }, transport: mapConsoleTransport, transportOptions: { mapLevels: { debug: "log", info: "info", warn: "warn", err: "error", }, }, }); log.debug("Print this with console.log"); log.err("Print this with console.error"); ``` -------------------------------- ### Asynchronous Logging for Performance Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Improve application performance by enabling asynchronous logging with `async: true`. The library automatically uses `requestIdleCallback` or `setTimeout` to defer logging, preventing UI thread blocking. ```javascript // Example configuration for async logging (actual code not shown, but concept explained in text) // logger.createLogger({ // async: true, // // ... other configurations // }); ``` -------------------------------- ### Configure Console Transport with Colors and Extensions Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Customize the `consoleTransport` by setting colors for log levels and extension namespaces. This allows for visually distinct log outputs. ```javascript import { logger, consoleTransport } from "react-native-logs"; var log = logger.createLogger({ levels: { debug: 0, info: 1, warn: 2, error: 3, }, transport: consoleTransport, transportOptions: { colors: { info: "blueBright", warn: "yellowBright", error: "redBright", }, extensionColors: { root: "magenta", home: "green", }, }, }); var rootLog = log.extend("root"); var homeLog = log.extend("home"); rootLog.info("Magenta Extension and bright blue message"); homeLog.error("Green Extension and bright red message"); ``` -------------------------------- ### Configure Logger with Common Options Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Use this snippet to set up the logger with custom log levels, severity, transport, and formatting options. Ensure 'react-native-logs' and 'consoleTransport' are imported. ```javascript import { logger, consoleTransport } from "react-native-logs"; var log = logger.createLogger({ levels: { debug: 0, info: 1, warn: 2, error: 3, }, severity: "debug", transport: consoleTransport, transportOptions: { colors: { info: "blueBright", warn: "yellowBright", error: "redBright", }, }, async: true, dateFormat: "time", printLevel: true, printDate: true, fixedExtLvlLength: false, enabled: true, }); log.debug("Debug message"); log.info({ message: "hi!" }); ``` -------------------------------- ### Configure File Async Transport Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Set up the fileAsyncTransport to save logs to a file. Requires `react-native-fs` or `expo-file-system`. Logs can be organized by date in the filename. ```javascript import { logger, fileAsyncTransport } from "react-native-logs"; import RNFS from "react-native-fs"; /* EXPO: * import * as FileSystem from 'expo-file-system'; */ let today = new Date(); let date = today.getDate(); let month = today.getMonth() + 1; let year = today.getFullYear(); var log = logger.createLogger({ severity: "debug", transport: fileAsyncTransport, transportOptions: { FS: RNFS, /* EXPO: * FS: FileSystem, */ fileName: `logs_{date-today}`, // Create a new file every day }, }); log.info("Print this string to a file"); ``` -------------------------------- ### Extend Logger with Namespaces Source: https://github.com/mowispace/react-native-logs/blob/master/README.md Create namespaced loggers using the 'extend' method to selectively enable logging for different app parts. Enabled extensions are configured via 'enabledExtensions'. ```javascript import { logger, consoleTransport } from "react-native-logs"; var log = logger.createLogger({ transport: consoleTransport, enabledExtensions: ["ROOT", "HOME"], }); var rootLog = log.extend("ROOT"); var homeLog = log.extend("HOME"); var profileLog = log.extend("PROFILE"); log.debug("print this"); // this will print "