npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

nuxt-winston-log

v1.2.0

Published

Enable logging to Winston in your Nuxt application

Downloads

8,946

Readme

nuxt-winston-log

A module to add winston / logging to your Nuxt application. This module only supports Nuxt apps running in universal mode.

By default the following events are captured:

  1. error level: SSR errors via Nuxt middleware hooks
  2. info level: Basic access logs for serverMiddleware endpoints + pages in your Nuxt app

All logs captured include a bit of additional metadata pulled from the Node.js request object:

{
  url: 'https://cool.net',
  method: 'GET',
  headers: {
    'X-Plumbus': "36f7b241-2910-4439-8671-749fc77dc213"
  }
}

Logs are output at ./logs/{NODE_ENV}.log by default. They are created in JSON Lines format.

Installation

  1. Install npm package
$ yarn add nuxt-winston-log # or npm i nuxt-winston-log
  1. Edit your nuxt.config.js file to add module
{
  modules: ['nuxt-winston-log']
}
  1. Change options using the winstonLog key as needed. See Usage section for details.

Usage

  1. By default, nuxt-winston-log exposes some basic options for common needs. Internally, these options are used to create a basic Logger instance and wire up middleware.

    The default values are:

    // ...
    {
      // Path that log files will be created in.
      // Change this to keep things neat.
      logPath: './logs',
    
      // Name of log file.
      // Change this to keep things tidy.
      logName: `${process.env.NODE_ENV}.log`,
    
      // Setting to determine if filesystem is accessed to auto-create logPath.
      // Set this to `false` for non-filesystem based logging setups.
      autoCreateLogPath: true,
    
      // Setting to determine if default logger instance is created for you.
      // Set this to `false` and provide `loggerOptions` (usage item #3) to
      // completely customize the logger instance (formatting, transports, etc.)
      useDefaultLogger: true,
    
      // Settings to determine if default handlers should be
      // registered for requests and errors respectively.
      // Set to `true` to skip request logging (level: info).
      skipRequestMiddlewareHandler: false,
      // Set to `true` to skip error logging (level: error).
      skipErrorMiddlewareHandler: false
    }
    // ...
  2. To customize the File Transport instance, pass options to the transportOptions key:

    Example in your apps ~/nuxt.config.js file:

    import path from 'path'
    const logfilePath = path.resolve(process.cwd(), './logs', `${process.env.NODE_ENV}.log`)
    
    export default {
      // Configure nuxt-winston-log module
      winstonLog: {
        transportOptions: {
          filename: logfilePath
        }
      }
    }
  3. To customize the Logger instance, set useDefaultLogger option to false, and make sure you provide a custom set of loggerOptions to be passed to Winston's createLogger under the hood:

    Example in your apps ~/nuxt.config.js file:

    // Note imports from winston core for transports, formatting helpers, etc.
    import { format, transports } from 'winston'
    const { combine, timestamp, label, prettyPrint } = format
    
    export default {
      // Configure nuxt-winston-log module
      winstonLog: {
        useDefaultLogger: false,
        loggerOptions: {
          format: combine(
            label({ label: 'Custom Nuxt logging!' }),
            timestamp(),
            prettyPrint()
          ),
          transports: [new transports.Console()]
        }
      }
    }
  4. To disable automatic creation of the logPath directory, set autoCreateLogPath option to false:

    Example in your apps ~/nuxt.config.js file:

    // ...
    export default {
      // Configure nuxt-winston-log module
      winstonLog: {
        autoCreateLogPath: false
      }
    }
    // ...
  5. To access the winston logger instance from within Nuxt lifecycle areas, use the $winstonLog key from the Nuxt context object. Note: This is only available for server-side executions. For example, because asyncData is an isomorphic function in Nuxt, you will need to guard $winstonLog access with something like if (process.server) { ... }

    Example nuxtServerInit in your apps ~/store/index.js:

    // ...
    export const actions = {
      async nuxtServerInit({ store, commit }, { req, $winstonLog }) {
        $winstonLog.info(`x-forwarded-host: ${req.headers['x-forwarded-host']}`)
      }
    }
    // ...

    Example asyncData in your apps ~/pages/somepage.vue:

    // ...
    asyncData(context) {
      if (process.server) {
        context.$winstonLog.info('Hello from asyncData on server')
      }
    }
    // ...
  6. To disable default request and error logging behaviors, the skipRequestMiddlewareHandler and skipErrorMiddlewareHandler options can be set to true. For more information on what these handlers do out of the box, see the source at the bottom of the ~/index.js file.

    Example in your apps ~/nuxt.config.js file:

    // ...
    export default {
      // Configure nuxt-winston-log module
      winstonLog: {
        skipRequestMiddlewareHandler: true,
        skipErrorMiddlewareHandler: true
      }
    }
    // ...

    Adding your own middleware handlers to Nuxt is outside the scope of this documentation, but can be accomplished using a custom module of your own.

    Because modules are executed sequentially, your custom module should be loaded after the nuxt-winston-log module. You can then access the logger instance via process.winstonLog as needed.

    See the ~/index.js file for some example middleware handlers / hooks.

Changelog