Nuxt Image Extractor

screenshot of Nuxt Image Extractor
nuxt

Nuxt image extractor for full static generated sites

Overview:

Nuxt Image Extractor is a npm module that allows you to download and store images from your CMS API in a folder inside the /dist directory of your Nuxt.js project. It also replaces the HTML sources with the local paths of the downloaded images. This module works with both the nuxt generate and nuxt export commands and supports image URL parameters. However, replacing payload image links is still not fully tested, so caution is advised when using this feature. Nuxt Image Extractor is based on a gist by emiliobondioli.

Features:

  • Downloads images from your CMS API and stores them in a folder inside /dist
  • Replaces HTML sources with the local paths of the downloaded images
  • Works with both nuxt generate and nuxt export commands
  • Supports image URL parameters like ?itok=gmJP5AbR
  • Replaces payload image links (although this feature is not fully tested yet)

Summary:

Nuxt Image Extractor is a helpful tool for Nuxt.js projects that need to download and store images from a CMS API. It simplifies the process by parsing each generated page, downloading the images, and replacing the HTML sources with the local paths. However, it is important to note that the feature for replacing payload image links is not fully tested and should be used with caution. Overall, Nuxt Image Extractor provides a convenient solution for managing images in Nuxt.js projects.

nuxt
Nuxt

nuxt.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.