Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Console logging for react?

I'm super new to React and I'm trying to get it set up for Meteor and piecing stuff together from other sources too. One of these other sources set up console logging for the app, but I'm going the ES6/JSX way so just using their code wouldn't work for me (or it doesn't seem like it does).

Some code I found for logging is

import Logger from 'simple-console-logger'; Logger.configure({level: 'debug'}); 

but I'm seeing this error cannot find module './dumy'

I also tried using react-logger and react-console-logger to no avail. Here's my code for the latter, which I believe should work.

import {Logger, ConsoleLogger} from 'react-console-logger'; const myLogger = new Logger(); export default class App extends Component {     render() {         myLogger.info('something witty');     } } 

However, myLogger.info('...') is making a call to node_modules/react-console-logger/lib/Logger.js which has it defined as

picture of code since copy-paste doesn't work

And this.logger is undefined, although I see it be defined above?

Does anyone know what I'm doing wrong? It looks to me like the library has it wrong, but maybe it has something to do with me using JSX files instead of js?

like image 402
adinutzyc21 Avatar asked Nov 17 '16 05:11

adinutzyc21


People also ask

Why is console log() so important in react?

By the end, you’ll have a better understanding of why console.log () is so important. An important thing to note is that console.log () is not exclusive to React! It’s a built-in method in JavaScript, and is useful outside React as well in the ways listed above.

What is logging in react development?

By Michael Auderer21 Mar 2019 Logging is an essential part of development. While working on React projects, logging provides a way to get feedback and information about what’s happening within the running code. However, once an app or website is deployed into production, the default console provides no way to continue benefiting from logs.

What is console log() and how do I use it?

It’s a built-in method in JavaScript, and is useful outside React as well in the ways listed above. Let’s get started! First, if you’ve never seen console.log () before, here’s a quick example and a few instructions for how to use it within Google Chrome (other browsers should be similar). All it does is print a value to the console.

What is the best logging service provider for react?

The following are some of the best logging service providers for React you can try out. Sentry provides a custom error boundary component for React, automatically sending JavaScript errors within a component tree to Sentry. You can use it similarly to React’s basic error boundary component. Sentry doesn’t impact a website’s performance.


1 Answers

If you're just after console logging here's what I'd do:

export default class App extends Component {   componentDidMount() {     console.log('I was triggered during componentDidMount')   }    render() {     console.log('I was triggered during render')     return (        <div> I am the App component </div>     )   } } 

Shouldn't be any need for those packages just to do console logging.

like image 185
patrick Avatar answered Sep 28 '22 02:09

patrick