{"id":15440,"library":"gatsby-source-build-date","title":"Gatsby Source Build Date","description":"The `gatsby-source-build-date` plugin, currently at version 1.0.1, provides a straightforward mechanism for integrating the site's compilation timestamp into Gatsby's internal GraphQL API. This enables developers to easily display a \"Last Updated\" or \"Last Built\" date in any component or page without manual updates. Unlike its predecessor, `gatsby-plugin-build-date`, this hard fork leverages Node.js's native `Intl.DateTimeFormat` for date internationalization and formatting, eliminating the dependency on third-party date libraries. This approach offers robust localization capabilities, allowing developers to specify `locales` and `options` directly in their `gatsby-config.js` for precise date string representation. The plugin makes the build date available as a `buildDate` node in the GraphQL schema, which can then be queried and formatted using Gatsby's standard GraphQL `formatString` arguments for `Date` types. It is specifically designed to reflect the timestamp of the entire site build process, not individual file modification times. As a Gatsby plugin, its release cadence is generally tied to the stability of the core Gatsby ecosystem, with updates typically addressing compatibility or minor enhancements rather than frequent breaking changes, especially given its reliance on a core Node.js API.","status":"active","version":"1.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/EdPike365/GatsbySourceBuildDate","tags":["javascript","gatsby","gatsby-plugin","date","build date","updated date"],"install":[{"cmd":"npm install gatsby-source-build-date","lang":"bash","label":"npm"},{"cmd":"yarn add gatsby-source-build-date","lang":"bash","label":"yarn"},{"cmd":"pnpm add gatsby-source-build-date","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Gatsby plugins are configured by their string name in `gatsby-config.js` for default behavior, not directly imported into component files.","wrong":"import 'gatsby-source-build-date'; // Incorrect for Gatsby plugins","symbol":"gatsby-source-build-date","correct":"// In gatsby-config.js\nmodule.exports = {\n  plugins: [\n    `gatsby-source-build-date`\n  ],\n};"},{"note":"To specify localization or formatting, the plugin must be configured as an object in `gatsby-config.js`.","wrong":"const pluginConfig = require('gatsby-source-build-date').config; // Incorrect module usage","symbol":"gatsby-source-build-date (with options)","correct":"// In gatsby-config.js\nmodule.exports = {\n  plugins: [\n    {\n      resolve: `gatsby-source-build-date`,\n      options: {\n        locales: \"fr-FR\",\n        options: { weekday: \"long\", year: \"numeric\", month: \"long\", day: \"numeric\" }\n      }\n    }\n  ],\n};"},{"note":"The build date is exposed as the `buildDate` field in Gatsby's GraphQL API, accessible via `useStaticQuery` or page queries in components.","wrong":"import { buildDate } from 'gatsby-source-build-date'; // This field is part of GraphQL API, not a direct JS export","symbol":"buildDate (GraphQL field)","correct":"query MySiteBuildDate {\n  buildDate {\n    date(formatString: \"MMMM DD, YYYY HH:mm:ss z\")\n  }\n}"}],"quickstart":{"code":"// gatsby-config.ts (or .js)\nimport type { GatsbyConfig } from 'gatsby';\n\nconst config: GatsbyConfig = {\n  plugins: [\n    {\n      resolve: `gatsby-source-build-date`,\n      options: {\n        locales: \"en-US\", // or \"fr-FR\", etc.\n        options: {\n          year: \"numeric\",\n          month: \"long\",\n          day: \"numeric\",\n          hour: \"numeric\",\n          minute: \"numeric\",\n          second: \"numeric\",\n          timeZoneName: \"short\",\n        },\n      },\n    },\n  ],\n};\n\nexport default config;\n\n// Example GraphQL query (run in Gatsby's GraphiQL IDE or a page query)\n// After configuring, restart your Gatsby development server.\n// Then navigate to http://localhost:8000/___graphql and run this query:\n/*\nquery SiteBuildDate {\n  buildDate {\n    date\n    # The date field is a Date object, allowing further formatting with formatString\n    formattedDate: date(formatString: \"YYYY-MM-DD HH:mm:ss Z\")\n  }\n}\n*/","lang":"typescript","description":"Demonstrates how to configure `gatsby-source-build-date` in `gatsby-config.js` with custom options and how to query the build date via GraphQL."},"warnings":[{"fix":"Ensure your Node.js environment is version 13 or higher. For deployment platforms like Netlify, explicitly set the Node.js version in your environment variables (e.g., `NODE_VERSION=14`).","message":"Node.js versions 12.x (e.g., v12.22) may ignore locale strings and formatting options provided to the plugin, resulting in dates being displayed in default English format regardless of configuration.","severity":"gotcha","affected_versions":"<=12.x"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"Upgrade your Node.js runtime to version 13 or newer. If deploying, check and configure the Node.js version of your CI/CD environment or hosting provider to ensure it's at least 13.","cause":"Running the Gatsby build process with Node.js version 12.x or earlier, which has known issues with `Intl.DateTimeFormat` respecting locale options.","error":"Date formatting and localization not applied as configured"}],"ecosystem":"npm"}