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

@netlify/plugin-gatsby

v3.8.1

Published

Netlify Build plugin - Run Gatsby seamlessly on Netlify

Downloads

117,466

Readme

Netlify Build plugin Gatsby – Run Gatsby seamlessly on Netlify

Essential Gatsby Plugin

The Essential Gatsby build plugin enables caching of builds, SSR and DSG render modes, image CDN and Gatsby Functions. It is installed automatically for all new Gatsby sites.

Note:

Installation

Gatsby sites need two plugins to support all features.

  1. The Netlify build plugin, called "Essential Gatsby" or @netlify/plugin-gatsby. This is installed automatically for all Gatsby sites deployed to Netlify.
  2. The Gatsby plugin gatsby-plugin-netlify. This needs to be manually installed.

Installing the Netlify build plugin

New Gatsby sites on Netlify automatically install the Essential Gatsby build plugin. You can confirm this in the build logs. If you need to install it manually, you have two options:

Install the Gatsby Plugin

You should also install the Gatsby plugin gatsby-plugin-netlify. This is required for SSR and DSG pages, and adds support for Gatsby redirects and asset caching rules:

  1. Add the package as a dependency:
npm install -D gatsby-plugin-netlify
  1. Then add the following to your gatsby-config.js file:
module.exports = {
  plugins: ['gatsby-plugin-netlify'],
}

See the gatsby-plugin-netlify docs for more information, including optional plugin configuration.

Disabling Netlify functions

In order to support Gatsby Functions and DSG and SSR render modes, this plugin generates four Netlify Functions called __api, __ssr, __dsg and _ipx. If you are not using any of these modes, then you can disable the creation of these functions. If you are using the latest version of gatsby-plugin-netlify then this will be handled automatically, disabling functions if the site has no Gatsby Functions, or DSG/SSR pages. Otherwise, you can do this manually by setting the environment variable NETLIFY_SKIP_GATSBY_FUNCTIONS to true. Be aware that if you do this, any DSG or SSR pages will not work, and nor will any Gatsby Functions or the remote image CDN.

Gatsby Image CDN

Gatsby includes beta support for deferred image resizing using a CDN. Netlify includes full support for Image CDN on all plans. For details on how to enable it, see the image CDN docs.

Caveats

Currently you cannot use StaticImage or gatsby-transformer-sharp in SSR or DSG pages. Support for Gatsby Image CDN is coming soon. The best workaround is to use an image CDN such as Cloudinary or imgix to host your images. This will give you faster builds and rendering too.

Local development

When developing Gatsby Functions it is usually easier to use the built-in gatsby develop functions server. However if you want to try the Netlify functions wrapper it will run via netlify dev. You should be sure to run netlify build first, so that the wrappers are generated and the functions copied across.

Netlify Background and Scheduled Functions

In order to use Netlify Background or Netlify Scheduled Functions in your Gatsby project, you will need to create a netlify/functions directory at the root of the project, and put the Functions in there.

Once that's completed, the Background or Scheduled Function can be invoked like an ordinary Gatsby function.