Gathering detailed insights and metrics for gatsby-remark-images-contentful
Gathering detailed insights and metrics for gatsby-remark-images-contentful
The best React-based framework with performance, scalability and security built in.
Installations
npm install gatsby-remark-images-contentfulDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Min. Node Version
>=18.0.0
Node Version
20.11.1
NPM Version
lerna/3.22.1/node@v20.11.1+arm64 (darwin)
Releases
149
gatsby-source-shopify@9.0.0
gatsby-source-shopify@9.0.0
Updated on Jan 07, 2025
gatsby-link@5.14.1
gatsby-link@5.14.1
Updated on Jan 07, 2025
gatsby-source-contentful@8.15.0
gatsby-source-contentful@8.15.0
Updated on Jan 07, 2025
v5.14.0
gatsby@5.14.0
Updated on Nov 06, 2024
gatsby-source-shopify@8.13.2
gatsby-source-shopify@8.13.2
Updated on Oct 28, 2024
gatsby-source-wordpress@7.13.5 and 6 more...
gatsby-source-wordpress@7.13.5
Updated on Oct 28, 2024
Languages
13
JavaScript
TypeScript
CSS
HTML
MDX
Shell
Dockerfile
PHP
EJS
Python
Less
SCSS
Stylus
JavaScript (58.91%)
TypeScript (38.71%)
CSS (1.05%)
HTML (0.69%)
MDX (0.45%)
Shell (0.13%)
Dockerfile (0.03%)
PHP (0.02%)
EJS (0.01%)
Developer
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
MIT License
55,908 Stars
21,738 Commits
10,290 Forks
719 Watchers
316 Branches
3,966 Contributors
Updated on Jul 15, 2025
Maintainers
7
Package Meta Information
Latest Version
6.14.0
Package Id
gatsby-remark-images-contentful@6.14.0
Unpacked Size
71.92 kB
Size
14.58 kB
File Count
8
NPM Version
lerna/3.22.1/node@v20.11.1+arm64 (darwin)
Node Version
20.11.1
Published on
Nov 06, 2024
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
Dev Dependencies
4
gatsby-remark-images-contentful
Processes images in markdown so they can be used in the production build using Contentful's Image API
In the processing, it makes images responsive by:
- Adding an elastic container to hold the size of the image while it loads to avoid layout jumps.
- Generating multiple versions of images at different widths and sets the
srcsetandsizesof theimgelement so regardless of the width of the device, the correct image is downloaded. - Using the "blur up" technique popularized by Medium and Facebook where a small 20px wide version of the image is shown as a placeholder until the actual image is downloaded.
Install
npm install gatsby-remark-images-contentful
How to use
1// In your gatsby-config.js 2plugins: [ 3 `gatsby-plugin-sharp`, 4 { 5 resolve: `gatsby-transformer-remark`, 6 options: { 7 plugins: [ 8 { 9 resolve: `gatsby-remark-images-contentful`, 10 options: { 11 // It's important to specify the maxWidth (in pixels) of 12 // the content container as this plugin uses this as the 13 // base for generating different widths of each image. 14 maxWidth: 590, 15 }, 16 }, 17 ], 18 }, 19 }, 20]
Options
| Name | Default | Description |
|---|---|---|
maxWidth | 650 | The maxWidth in pixels of the div where the markdown will be displayed. This value is used when deciding what the width of the various responsive thumbnails should be. |
linkImagesToOriginal | true | Add a link to each image to the original image. Sometimes people want to see a full-sized version of an image e.g. to see extra detail on a part of the image and this is a convenient and common pattern for enabling this. Set this option to false to disable this behavior. |
showCaptions | false | Add a caption to each image with the contents of the title attribute, when this is not empty. Set this option to true to enable this behavior. |
wrapperStyle | Add custom styles to the div wrapping the responsive images. Use regular CSS syntax, e.g. margin-bottom:10px; background: red; | |
backgroundColor | white | Set the background color of the image to match the background of your design |
withWebp | false | Additionally generate WebP versions alongside your chosen file format. They are added as a srcset with the appropriate mimetype and will be loaded in browsers that support the format. |
loading | lazy | Set the browser's native lazy loading attribute. One of lazy, eager or auto. |
Troubleshooting
Incompatible library version: sharp.node requires version X or later, but Z provides version Y
This means that there are multiple incompatible versions of the sharp package installed in node_modules. The complete error typically looks like this:
1Something went wrong installing the "sharp" module 2 3dlopen(/Users/misiek/dev/gatsby-starter-blog/node_modules/sharp/build/Release/sharp.node, 1): Library not loaded: @rpath/libglib-2.0.dylib 4 Referenced from: /Users/misiek/dev/gatsby-starter-blog/node_modules/sharp/build/Release/sharp.node 5 Reason: Incompatible library version: sharp.node requires version 6001.0.0 or later, but libglib-2.0.dylib provides version 5801.0.0
To fix this, you'll need to update all Gatsby plugins in the current project that depend on the sharp package. Here's a list of official plugins that you might need to update in case your projects uses them:
gatsby-plugin-sharpgatsby-plugin-manifestgatsby-remark-images-contentfulgatsby-source-contentfulgatsby-transformer-sharpgatsby-transformer-sqip
To update these packages, run:
1npm install gatsby-plugin-sharp gatsby-plugin-manifest gatsby-remark-images-contentful gatsby-source-contentful gatsby-transformer-sharp gatsby-transformer-sqip
If updating these doesn't fix the issue, your project probably uses other plugins from the community that depend on a different version of sharp. Try running npm list sharp or yarn why sharp to see all packages in the current project that use sharp and try updating them as well.
No vulnerabilities found.
Reason
security policy file detected
Details
- Info: security policy file detected: SECURITY.md:1
- Info: Found linked content: SECURITY.md:1
- Info: Found disclosure, vulnerability, and/or timelines in security policy: SECURITY.md:1
- Info: Found text in security policy: SECURITY.md:1
Reason
no dangerous workflow patterns detected
Reason
GitHub workflow tokens follow principle of least privilege
Details
- Info: jobLevel 'contents' permission set to 'read': .github/workflows/schedule-stale.yml:10
- Info: topLevel 'contents' permission set to 'read': .github/workflows/schedule-stale.yml:6
- Info: no jobLevel write permissions found
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
no binaries found in the repo
Reason
Found 20/25 approved changesets -- score normalized to 8
Reason
8 commit(s) and 2 issue activity found in the last 90 days -- score normalized to 8
Reason
SAST tool is not run on all commits -- score normalized to 8
Details
- Warn: 22 commits out of 26 are checked with a SAST tool
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/schedule-stale.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/gatsbyjs/gatsby/schedule-stale.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/schedule-stale.yml:15: update your workflow using https://app.stepsecurity.io/secureworkflow/gatsbyjs/gatsby/schedule-stale.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/schedule-stale.yml:51: update your workflow using https://app.stepsecurity.io/secureworkflow/gatsbyjs/gatsby/schedule-stale.yml/master?enable=pin
- Warn: containerImage not pinned by hash: .github/actions/gatsby-site-showcase-validator/Dockerfile:1: pin your Docker image by updating node:10-slim to node:10-slim@sha256:88932859e3d022d79161b99628c4c2c50e836437455e2d1b1a008d98367b10d6
- Warn: containerImage not pinned by hash: .github/actions/high-priority-prs/Dockerfile:1: pin your Docker image by updating node:10-slim to node:10-slim@sha256:88932859e3d022d79161b99628c4c2c50e836437455e2d1b1a008d98367b10d6
- Warn: containerImage not pinned by hash: .gitpod.Dockerfile:1: pin your Docker image by updating gitpod/workspace-full to gitpod/workspace-full@sha256:b1195dfae7ee9a12a89d195247c3e1357cc6a18360a41473dbec67525ef434e2
- Warn: containerImage not pinned by hash: benchmarks/docker-runner/Dockerfile:1: pin your Docker image by updating node:14-buster to node:14-buster@sha256:a158d3b9b4e3fa813fa6c8c590b8f0a860e015ad4e59bbce5744d2f6fd8461aa
- Warn: containerImage not pinned by hash: integration-tests/gatsby-source-wordpress/docker/wordpress/Dockerfile:1: pin your Docker image by updating wordpress:6.1 to wordpress:6.1@sha256:6991d7aea34c9746ab76ab22bcccdedc3594d37a148e08161c29b128bd50294c
- Warn: containerImage not pinned by hash: integration-tests/gatsby-source-wordpress/docker/wp-cli/Dockerfile:1: pin your Docker image by updating wordpress:cli-php7.4 to wordpress:cli-php7.4@sha256:946a8b7f237f6cf90d8f04aff952544a0332d43374d598925dcf0180e4441c6c
- Warn: npmCommand not pinned by hash: .gitpod.Dockerfile:8
- Warn: npmCommand not pinned by hash: benchmarks/docker-runner/Dockerfile:6
- Warn: npmCommand not pinned by hash: examples/build-all-examples.sh:34
- Warn: npmCommand not pinned by hash: scripts/e2e-test.sh:17
- Warn: npmCommand not pinned by hash: scripts/e2e-test.sh:17
- Info: 0 out of 2 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 1 third-party GitHubAction dependencies pinned
- Info: 0 out of 6 containerImage dependencies pinned
- Info: 1 out of 6 npmCommand dependencies pinned
Reason
100 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-jr5f-v2jv-69x6
- Warn: Project is vulnerable to: GHSA-xq7p-g2vc-g82p
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-4gmj-3p3h-gm8h
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-9pv7-vfvm-6vr7
- Warn: Project is vulnerable to: GHSA-rc47-6667-2j5j
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-7hpj-7hhx-2fgx
- Warn: Project is vulnerable to: GHSA-44fp-w29j-9vj5
- Warn: Project is vulnerable to: GHSA-4pg4-qvpc-4q3h
- Warn: Project is vulnerable to: GHSA-g5hg-p3ph-g8qg
- Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-x7hr-w5r2-h6wg
- Warn: Project is vulnerable to: GHSA-rm97-x556-q36h
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-76p7-773f-r4q5
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-pq67-2wwv-3xjx
- Warn: Project is vulnerable to: GHSA-8cj5-5rvv-wf4v
- Warn: Project is vulnerable to: GHSA-4vvj-4cpr-p986
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-f9xv-q969-pqx4
- Warn: Project is vulnerable to: GHSA-c429-5p7v-vgjp
- Warn: Project is vulnerable to: GHSA-h5c3-5r3r-rr8q
- Warn: Project is vulnerable to: GHSA-rmvr-2pp2-xj38
- Warn: Project is vulnerable to: GHSA-xx4v-prfh-6cgc
- Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-wg6g-ppvx-927h
- Warn: Project is vulnerable to: GHSA-7gc6-qh9x-w6h8
- Warn: Project is vulnerable to: GHSA-8gh8-hqwg-xf34
- Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97
- Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
- Warn: Project is vulnerable to: GHSA-pfq8-rq6v-vf5m
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-2pr6-76vf-7546
- Warn: Project is vulnerable to: GHSA-8j8c-7jfh-h6hx
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-8cf7-32gw-wr33
- Warn: Project is vulnerable to: GHSA-hjrf-2m68-5959
- Warn: Project is vulnerable to: GHSA-qwph-4952-7xr6
- Warn: Project is vulnerable to: GHSA-3wc5-fcw2-2329
- Warn: Project is vulnerable to: GHSA-64fm-8hw2-v72w
- Warn: Project is vulnerable to: GHSA-f98w-7cxr-ff2h
- Warn: Project is vulnerable to: GHSA-cg87-wmx4-v546
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-w7rc-rwvf-8q5r
- Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g
- Warn: Project is vulnerable to: GHSA-px4h-xg32-q955
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-8g77-54rh-46hx
- Warn: Project is vulnerable to: GHSA-3j8f-xvm3-ffx4
- Warn: Project is vulnerable to: GHSA-4p35-cfcx-8653
- Warn: Project is vulnerable to: GHSA-7f3x-x4pr-wqhj
- Warn: Project is vulnerable to: GHSA-jpp7-7chh-cf67
- Warn: Project is vulnerable to: GHSA-q6wq-5p59-983w
- Warn: Project is vulnerable to: GHSA-j9fq-vwqv-2fm2
- Warn: Project is vulnerable to: GHSA-pqw5-jmp5-px4v
- Warn: Project is vulnerable to: GHSA-566m-qj78-rww5
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-rxrc-rgv4-jpvx
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-w5p7-h5w8-2hfq
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-38fc-wpqx-33j7
- Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3
- Warn: Project is vulnerable to: GHSA-g3ch-rx76-35fx
- Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv
- Warn: Project is vulnerable to: GHSA-4r6h-8v6p-xvw6
- Warn: Project is vulnerable to: GHSA-5pgg-2g8v-p4x9
- Warn: Project is vulnerable to: GHSA-h6q6-9hqw-rwfv
- Warn: Project is vulnerable to: GHSA-5fg8-2547-mr8q
- Warn: Project is vulnerable to: GHSA-crh6-fp67-6883
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
Score
6.7
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More