@opensourceframework/next-images
Advanced tools
+127
| 'use strict'; | ||
| Object.defineProperty(exports, '__esModule', { value: true }); | ||
| var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { | ||
| get: (a, b) => (typeof require !== "undefined" ? require : a)[b] | ||
| }) : x)(function(x) { | ||
| if (typeof require !== "undefined") return require.apply(this, arguments); | ||
| throw Error('Dynamic require of "' + x + '" is not supported'); | ||
| }); | ||
| // src/index.ts | ||
| var DEFAULT_FILE_EXTENSIONS = [ | ||
| "jpg", | ||
| "jpeg", | ||
| "png", | ||
| "svg", | ||
| "gif", | ||
| "ico", | ||
| "webp", | ||
| "jp2", | ||
| "avif" | ||
| ]; | ||
| var DEFAULT_INLINE_IMAGE_LIMIT = 8192; | ||
| var DEFAULT_NAME = "[name]-[hash].[ext]"; | ||
| function withImages(nextConfig = {}) { | ||
| const { | ||
| dynamicAssetPrefix = false, | ||
| inlineImageLimit = DEFAULT_INLINE_IMAGE_LIMIT, | ||
| assetPrefix = "", | ||
| basePath = "", | ||
| fileExtensions = [...DEFAULT_FILE_EXTENSIONS], | ||
| exclude, | ||
| name = DEFAULT_NAME, | ||
| esModule = false, | ||
| ...restConfig | ||
| } = nextConfig; | ||
| return Object.assign({}, restConfig, { | ||
| // Configure server runtime config for dynamic asset prefix | ||
| serverRuntimeConfig: dynamicAssetPrefix ? Object.assign({}, nextConfig.serverRuntimeConfig, { | ||
| nextImagesAssetPrefix: assetPrefix || basePath | ||
| }) : nextConfig.serverRuntimeConfig, | ||
| /** | ||
| * Webpack configuration modifier | ||
| * Adds rules for handling image files | ||
| */ | ||
| webpack(config, options) { | ||
| const { isServer } = options; | ||
| if (!options.defaultLoaders) { | ||
| throw new Error( | ||
| "This plugin is not compatible with Next.js versions below 5.0.0. Please upgrade Next.js to version 5.0.0 or higher. See: https://nextjs.org/docs/migrating" | ||
| ); | ||
| } | ||
| const extensionsPattern = fileExtensions.join("|"); | ||
| const testRegex = new RegExp(`\\.(${extensionsPattern})$`); | ||
| const issuerRegex = new RegExp("\\.\\w+(?<!(s?c|sa)ss)$", "i"); | ||
| const imageRule = { | ||
| test: testRegex, | ||
| issuer: issuerRegex, | ||
| exclude, | ||
| use: [ | ||
| { | ||
| loader: __require.resolve("url-loader"), | ||
| options: { | ||
| // Inline images below the limit as Base64 | ||
| limit: inlineImageLimit === false ? -1 : inlineImageLimit, | ||
| // Use file-loader for images above the limit | ||
| fallback: __require.resolve("file-loader"), | ||
| // Output path for image files | ||
| outputPath: `${isServer ? "../" : ""}static/images/`, | ||
| // Public path configuration | ||
| ...dynamicAssetPrefix ? { | ||
| // Dynamic public path for runtime resolution | ||
| publicPath: `${isServer ? "/_next/" : ""}static/images/`, | ||
| postTransformPublicPath: (p) => { | ||
| if (isServer) { | ||
| return `(require("next/config").default().serverRuntimeConfig.nextImagesAssetPrefix || '') + ${p}`; | ||
| } | ||
| return `(__webpack_public_path__ || '') + ${p}`; | ||
| } | ||
| } : { | ||
| // Static public path from config | ||
| publicPath: `${assetPrefix || basePath || ""}/_next/static/images/` | ||
| }, | ||
| // Output file name template | ||
| name, | ||
| // ES modules syntax | ||
| esModule | ||
| } | ||
| } | ||
| ] | ||
| }; | ||
| config.module.rules.push(imageRule); | ||
| if (typeof nextConfig.webpack === "function") { | ||
| return nextConfig.webpack(config, options); | ||
| } | ||
| return config; | ||
| } | ||
| }); | ||
| } | ||
| var index_default = withImages; | ||
| /** | ||
| * next-images - Import images in Next.js | ||
| * | ||
| * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif) | ||
| * in your Next.js project using webpack file-loader and url-loader. | ||
| * | ||
| * @packageDocumentation | ||
| * | ||
| * @deprecated | ||
| * This package is deprecated. Next.js 10+ includes a built-in Image component | ||
| * that provides automatic image optimization, lazy loading, and better performance. | ||
| * Consider migrating to next/image instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| * | ||
| * @license MIT | ||
| * @originalAuthor Aref Aslani (twopluszero) | ||
| * @originalRepo https://github.com/twopluszero/next-images | ||
| */ | ||
| exports.DEFAULT_FILE_EXTENSIONS = DEFAULT_FILE_EXTENSIONS; | ||
| exports.DEFAULT_INLINE_IMAGE_LIMIT = DEFAULT_INLINE_IMAGE_LIMIT; | ||
| exports.DEFAULT_NAME = DEFAULT_NAME; | ||
| exports.default = index_default; | ||
| exports.withImages = withImages; | ||
| //# sourceMappingURL=index.cjs.map | ||
| //# sourceMappingURL=index.cjs.map |
| {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"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","file":"index.cjs","sourcesContent":["/**\n * next-images - Import images in Next.js\n *\n * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif)\n * in your Next.js project using webpack file-loader and url-loader.\n *\n * @packageDocumentation\n *\n * @deprecated\n * This package is deprecated. Next.js 10+ includes a built-in Image component\n * that provides automatic image optimization, lazy loading, and better performance.\n * Consider migrating to next/image instead.\n * @see https://nextjs.org/docs/api-reference/next/image\n *\n * @license MIT\n * @originalAuthor Aref Aslani (twopluszero)\n * @originalRepo https://github.com/twopluszero/next-images\n */\n\nimport type { NextConfig, WebpackConfig, WebpackConfigContext } from './types';\n\nexport type { NextConfig, WebpackConfig, WebpackConfigContext } from './types';\n\n/**\n * Configuration options for the withImages plugin\n */\nexport interface WithImagesOptions {\n /**\n * Maximum file size (in bytes) for inlining images as Base64.\n * Images smaller than this limit will be inlined as data URLs.\n * Set to `false` to disable inlining entirely.\n * @default 8192 (8KB)\n */\n inlineImageLimit?: number | false;\n\n /**\n * Asset prefix for serving images from a CDN or external domain.\n * @see https://nextjs.org/docs/api-reference/next.config.js/cdn-support-with-asset-prefix\n */\n assetPrefix?: string;\n\n /**\n * Base path for the application.\n * @see https://nextjs.org/docs/api-reference/next.config.js/basepath\n */\n basePath?: string;\n\n /**\n * File extensions to handle with this loader.\n * @default [\"jpg\", \"jpeg\", \"png\", \"svg\", \"gif\", \"ico\", \"webp\", \"jp2\", \"avif\"]\n */\n fileExtensions?: string[];\n\n /**\n * Paths to exclude from the loader.\n * Useful when you want to handle certain files with a different loader (e.g., svg-react-loader).\n */\n exclude?: RegExp | string;\n\n /**\n * Template for output file names.\n * @default \"[name]-[hash].[ext]\"\n * @see https://github.com/webpack/loader-utils#interpolatename\n */\n name?: string;\n\n /**\n * Enable ES modules syntax for the output.\n * When enabled, you need to use `.default` when using require().\n * @default false\n */\n esModule?: boolean;\n\n /**\n * Enable dynamic asset prefix resolution at runtime.\n * Useful when assetPrefix can change dynamically.\n * @default false\n */\n dynamicAssetPrefix?: boolean;\n\n /**\n * Custom webpack configuration function.\n * This will be merged with the image loader configuration.\n */\n webpack?: NextConfig['webpack'];\n\n /**\n * Server runtime configuration.\n */\n serverRuntimeConfig?: Record<string, unknown>;\n}\n\n/**\n * Result type of the withImages function - a Next.js configuration object\n */\nexport type WithImagesResult = NextConfig & {\n serverRuntimeConfig?: Record<string, unknown>;\n};\n\n/**\n * Default file extensions supported by the loader\n */\nexport const DEFAULT_FILE_EXTENSIONS = [\n 'jpg',\n 'jpeg',\n 'png',\n 'svg',\n 'gif',\n 'ico',\n 'webp',\n 'jp2',\n 'avif',\n] as const;\n\n/**\n * Default inline image limit (8KB)\n */\nexport const DEFAULT_INLINE_IMAGE_LIMIT = 8192;\n\n/**\n * Default output file name template\n */\nexport const DEFAULT_NAME = '[name]-[hash].[ext]';\n\n/**\n * Next.js plugin for importing images in your project.\n *\n * This function wraps your Next.js configuration and adds webpack rules\n * for handling image files using url-loader (for small images) and file-loader\n * (for larger images).\n *\n * @param nextConfig - Your existing Next.js configuration options\n * @returns Modified Next.js configuration with image handling\n *\n * @example\n * ```js\n * // next.config.js\n * const withImages = require('next-images');\n *\n * module.exports = withImages();\n * ```\n *\n * @example\n * ```js\n * // With custom options\n * const withImages = require('next-images');\n *\n * module.exports = withImages({\n * inlineImageLimit: 16384,\n * fileExtensions: ['jpg', 'png', 'svg'],\n * webpack(config, options) {\n * // Additional webpack configuration\n * return config;\n * }\n * });\n * ```\n *\n * @deprecated\n * Consider using Next.js built-in Image component instead.\n * @see https://nextjs.org/docs/api-reference/next/image\n */\nfunction withImages(nextConfig: WithImagesOptions = {}): WithImagesResult {\n const {\n dynamicAssetPrefix = false,\n inlineImageLimit = DEFAULT_INLINE_IMAGE_LIMIT,\n assetPrefix = '',\n basePath = '',\n fileExtensions = [...DEFAULT_FILE_EXTENSIONS],\n exclude,\n name = DEFAULT_NAME,\n esModule = false,\n ...restConfig\n } = nextConfig;\n\n return Object.assign({}, restConfig as NextConfig, {\n // Configure server runtime config for dynamic asset prefix\n serverRuntimeConfig: dynamicAssetPrefix\n ? Object.assign({}, nextConfig.serverRuntimeConfig, {\n nextImagesAssetPrefix: assetPrefix || basePath,\n })\n : nextConfig.serverRuntimeConfig,\n\n /**\n * Webpack configuration modifier\n * Adds rules for handling image files\n */\n webpack(config: WebpackConfig, options: WebpackConfigContext): WebpackConfig {\n const { isServer } = options;\n\n // Check for Next.js version compatibility\n if (!options.defaultLoaders) {\n throw new Error(\n 'This plugin is not compatible with Next.js versions below 5.0.0. ' +\n 'Please upgrade Next.js to version 5.0.0 or higher. ' +\n 'See: https://nextjs.org/docs/migrating'\n );\n }\n\n // Create regex pattern for matching image file extensions\n const extensionsPattern = fileExtensions.join('|');\n const testRegex = new RegExp(`\\\\.(${extensionsPattern})$`);\n\n // Issuer pattern: Next.js already handles url() in CSS/SCSS/SASS files\n // We only want to handle images imported from JS/TS files\n const issuerRegex = new RegExp('\\\\.\\\\w+(?<!(s?c|sa)ss)$', 'i');\n\n // Build the webpack rule for image files\n const imageRule = {\n test: testRegex,\n issuer: issuerRegex,\n exclude: exclude,\n use: [\n {\n loader: require.resolve('url-loader'),\n options: {\n // Inline images below the limit as Base64\n limit: inlineImageLimit === false ? -1 : inlineImageLimit,\n // Use file-loader for images above the limit\n fallback: require.resolve('file-loader'),\n // Output path for image files\n outputPath: `${isServer ? '../' : ''}static/images/`,\n // Public path configuration\n ...(dynamicAssetPrefix\n ? {\n // Dynamic public path for runtime resolution\n publicPath: `${isServer ? '/_next/' : ''}static/images/`,\n postTransformPublicPath: (p: string): string => {\n if (isServer) {\n // On server, resolve asset prefix from runtime config\n return `(require(\"next/config\").default().serverRuntimeConfig.nextImagesAssetPrefix || '') + ${p}`;\n }\n // On client, use webpack public path\n return `(__webpack_public_path__ || '') + ${p}`;\n },\n }\n : {\n // Static public path from config\n publicPath: `${assetPrefix || basePath || ''}/_next/static/images/`,\n }),\n // Output file name template\n name: name,\n // ES modules syntax\n esModule: esModule,\n },\n },\n ],\n };\n\n // Add the image rule to webpack config\n config.module.rules.push(imageRule);\n\n // Call user's custom webpack function if provided\n if (typeof nextConfig.webpack === 'function') {\n return nextConfig.webpack(config, options);\n }\n\n return config;\n },\n });\n}\n\nexport { withImages };\n\n// Default export for CommonJS compatibility\nexport default withImages;"]} |
+272
| /** | ||
| * Type definitions for next-images | ||
| * | ||
| * These types are compatible with Next.js 12-16 | ||
| */ | ||
| /** | ||
| * Webpack configuration object (simplified) | ||
| */ | ||
| interface WebpackConfig { | ||
| module: { | ||
| rules: Array<{ | ||
| test: RegExp; | ||
| issuer?: RegExp; | ||
| exclude?: RegExp | string; | ||
| use?: Array<{ | ||
| loader: string; | ||
| options?: Record<string, unknown>; | ||
| }>; | ||
| }>; | ||
| }; | ||
| [key: string]: unknown; | ||
| } | ||
| /** | ||
| * Webpack build context options | ||
| */ | ||
| interface WebpackContextOptions { | ||
| /** Whether this is a server-side build */ | ||
| isServer: boolean; | ||
| /** Whether this is a development build */ | ||
| dev?: boolean; | ||
| /** Default loaders provided by Next.js */ | ||
| defaultLoaders?: { | ||
| babel?: unknown; | ||
| }; | ||
| /** Build ID */ | ||
| buildId?: string; | ||
| /** Config object */ | ||
| config?: NextConfig; | ||
| /** Total pages */ | ||
| totalPages?: number; | ||
| /** Directory to output build */ | ||
| distDir?: string; | ||
| /** Whether the build has a static export */ | ||
| hasExport?: boolean; | ||
| /** Directory for static export */ | ||
| exportPathMap?: () => Record<string, unknown>; | ||
| } | ||
| /** | ||
| * Webpack configuration function context | ||
| */ | ||
| interface WebpackConfigContext extends WebpackContextOptions { | ||
| /** Entry points */ | ||
| entry?: Record<string, string[]>; | ||
| /** Whether this is for static export */ | ||
| isStatic?: boolean; | ||
| /** Default loaders */ | ||
| defaultLoaders: { | ||
| babel: unknown; | ||
| }; | ||
| } | ||
| /** | ||
| * Next.js configuration object | ||
| */ | ||
| interface NextConfig { | ||
| /** Asset prefix for CDN support */ | ||
| assetPrefix?: string; | ||
| /** Base path for the application */ | ||
| basePath?: string; | ||
| /** Server-side runtime configuration */ | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| /** Public runtime configuration */ | ||
| publicRuntimeConfig?: Record<string, unknown>; | ||
| /** Webpack configuration function */ | ||
| webpack?: (config: WebpackConfig, options: WebpackConfigContext) => WebpackConfig; | ||
| /** Experimental features */ | ||
| experimental?: Record<string, unknown>; | ||
| /** Environment variables */ | ||
| env?: Record<string, string>; | ||
| /** Rewrites for routing */ | ||
| rewrites?: Array<{ | ||
| source: string; | ||
| destination: string; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| destination: string; | ||
| }>>); | ||
| /** Redirects for routing */ | ||
| redirects?: Array<{ | ||
| source: string; | ||
| destination: string; | ||
| permanent?: boolean; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| destination: string; | ||
| permanent?: boolean; | ||
| }>>); | ||
| /** Headers configuration */ | ||
| headers?: Array<{ | ||
| source: string; | ||
| headers: Array<{ | ||
| key: string; | ||
| value: string; | ||
| }>; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| headers: Array<{ | ||
| key: string; | ||
| value: string; | ||
| }>; | ||
| }>>); | ||
| /** Image optimization configuration */ | ||
| images?: { | ||
| domains?: string[]; | ||
| loader?: 'default' | 'imgix' | 'cloudinary' | 'akamai' | 'custom'; | ||
| path?: string; | ||
| deviceSizes?: number[]; | ||
| imageSizes?: number[]; | ||
| minimumCacheTTL?: number; | ||
| formats?: ('image/avif' | 'image/webp')[]; | ||
| dangerouslyAllowSVG?: boolean; | ||
| contentSecurityPolicy?: string; | ||
| }; | ||
| /** TypeScript configuration */ | ||
| typescript?: { | ||
| ignoreBuildErrors?: boolean; | ||
| }; | ||
| /** ESLint configuration */ | ||
| eslint?: { | ||
| ignoreDuringBuilds?: boolean; | ||
| }; | ||
| /** Output configuration */ | ||
| output?: 'standalone' | 'export'; | ||
| /** Other configuration options */ | ||
| [key: string]: unknown; | ||
| } | ||
| /** | ||
| * next-images - Import images in Next.js | ||
| * | ||
| * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif) | ||
| * in your Next.js project using webpack file-loader and url-loader. | ||
| * | ||
| * @packageDocumentation | ||
| * | ||
| * @deprecated | ||
| * This package is deprecated. Next.js 10+ includes a built-in Image component | ||
| * that provides automatic image optimization, lazy loading, and better performance. | ||
| * Consider migrating to next/image instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| * | ||
| * @license MIT | ||
| * @originalAuthor Aref Aslani (twopluszero) | ||
| * @originalRepo https://github.com/twopluszero/next-images | ||
| */ | ||
| /** | ||
| * Configuration options for the withImages plugin | ||
| */ | ||
| interface WithImagesOptions { | ||
| /** | ||
| * Maximum file size (in bytes) for inlining images as Base64. | ||
| * Images smaller than this limit will be inlined as data URLs. | ||
| * Set to `false` to disable inlining entirely. | ||
| * @default 8192 (8KB) | ||
| */ | ||
| inlineImageLimit?: number | false; | ||
| /** | ||
| * Asset prefix for serving images from a CDN or external domain. | ||
| * @see https://nextjs.org/docs/api-reference/next.config.js/cdn-support-with-asset-prefix | ||
| */ | ||
| assetPrefix?: string; | ||
| /** | ||
| * Base path for the application. | ||
| * @see https://nextjs.org/docs/api-reference/next.config.js/basepath | ||
| */ | ||
| basePath?: string; | ||
| /** | ||
| * File extensions to handle with this loader. | ||
| * @default ["jpg", "jpeg", "png", "svg", "gif", "ico", "webp", "jp2", "avif"] | ||
| */ | ||
| fileExtensions?: string[]; | ||
| /** | ||
| * Paths to exclude from the loader. | ||
| * Useful when you want to handle certain files with a different loader (e.g., svg-react-loader). | ||
| */ | ||
| exclude?: RegExp | string; | ||
| /** | ||
| * Template for output file names. | ||
| * @default "[name]-[hash].[ext]" | ||
| * @see https://github.com/webpack/loader-utils#interpolatename | ||
| */ | ||
| name?: string; | ||
| /** | ||
| * Enable ES modules syntax for the output. | ||
| * When enabled, you need to use `.default` when using require(). | ||
| * @default false | ||
| */ | ||
| esModule?: boolean; | ||
| /** | ||
| * Enable dynamic asset prefix resolution at runtime. | ||
| * Useful when assetPrefix can change dynamically. | ||
| * @default false | ||
| */ | ||
| dynamicAssetPrefix?: boolean; | ||
| /** | ||
| * Custom webpack configuration function. | ||
| * This will be merged with the image loader configuration. | ||
| */ | ||
| webpack?: NextConfig['webpack']; | ||
| /** | ||
| * Server runtime configuration. | ||
| */ | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| } | ||
| /** | ||
| * Result type of the withImages function - a Next.js configuration object | ||
| */ | ||
| type WithImagesResult = NextConfig & { | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| }; | ||
| /** | ||
| * Default file extensions supported by the loader | ||
| */ | ||
| declare const DEFAULT_FILE_EXTENSIONS: readonly ["jpg", "jpeg", "png", "svg", "gif", "ico", "webp", "jp2", "avif"]; | ||
| /** | ||
| * Default inline image limit (8KB) | ||
| */ | ||
| declare const DEFAULT_INLINE_IMAGE_LIMIT = 8192; | ||
| /** | ||
| * Default output file name template | ||
| */ | ||
| declare const DEFAULT_NAME = "[name]-[hash].[ext]"; | ||
| /** | ||
| * Next.js plugin for importing images in your project. | ||
| * | ||
| * This function wraps your Next.js configuration and adds webpack rules | ||
| * for handling image files using url-loader (for small images) and file-loader | ||
| * (for larger images). | ||
| * | ||
| * @param nextConfig - Your existing Next.js configuration options | ||
| * @returns Modified Next.js configuration with image handling | ||
| * | ||
| * @example | ||
| * ```js | ||
| * // next.config.js | ||
| * const withImages = require('next-images'); | ||
| * | ||
| * module.exports = withImages(); | ||
| * ``` | ||
| * | ||
| * @example | ||
| * ```js | ||
| * // With custom options | ||
| * const withImages = require('next-images'); | ||
| * | ||
| * module.exports = withImages({ | ||
| * inlineImageLimit: 16384, | ||
| * fileExtensions: ['jpg', 'png', 'svg'], | ||
| * webpack(config, options) { | ||
| * // Additional webpack configuration | ||
| * return config; | ||
| * } | ||
| * }); | ||
| * ``` | ||
| * | ||
| * @deprecated | ||
| * Consider using Next.js built-in Image component instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| */ | ||
| declare function withImages(nextConfig?: WithImagesOptions): WithImagesResult; | ||
| export { DEFAULT_FILE_EXTENSIONS, DEFAULT_INLINE_IMAGE_LIMIT, DEFAULT_NAME, type NextConfig, type WebpackConfig, type WebpackConfigContext, type WithImagesOptions, type WithImagesResult, withImages as default, withImages }; |
+272
| /** | ||
| * Type definitions for next-images | ||
| * | ||
| * These types are compatible with Next.js 12-16 | ||
| */ | ||
| /** | ||
| * Webpack configuration object (simplified) | ||
| */ | ||
| interface WebpackConfig { | ||
| module: { | ||
| rules: Array<{ | ||
| test: RegExp; | ||
| issuer?: RegExp; | ||
| exclude?: RegExp | string; | ||
| use?: Array<{ | ||
| loader: string; | ||
| options?: Record<string, unknown>; | ||
| }>; | ||
| }>; | ||
| }; | ||
| [key: string]: unknown; | ||
| } | ||
| /** | ||
| * Webpack build context options | ||
| */ | ||
| interface WebpackContextOptions { | ||
| /** Whether this is a server-side build */ | ||
| isServer: boolean; | ||
| /** Whether this is a development build */ | ||
| dev?: boolean; | ||
| /** Default loaders provided by Next.js */ | ||
| defaultLoaders?: { | ||
| babel?: unknown; | ||
| }; | ||
| /** Build ID */ | ||
| buildId?: string; | ||
| /** Config object */ | ||
| config?: NextConfig; | ||
| /** Total pages */ | ||
| totalPages?: number; | ||
| /** Directory to output build */ | ||
| distDir?: string; | ||
| /** Whether the build has a static export */ | ||
| hasExport?: boolean; | ||
| /** Directory for static export */ | ||
| exportPathMap?: () => Record<string, unknown>; | ||
| } | ||
| /** | ||
| * Webpack configuration function context | ||
| */ | ||
| interface WebpackConfigContext extends WebpackContextOptions { | ||
| /** Entry points */ | ||
| entry?: Record<string, string[]>; | ||
| /** Whether this is for static export */ | ||
| isStatic?: boolean; | ||
| /** Default loaders */ | ||
| defaultLoaders: { | ||
| babel: unknown; | ||
| }; | ||
| } | ||
| /** | ||
| * Next.js configuration object | ||
| */ | ||
| interface NextConfig { | ||
| /** Asset prefix for CDN support */ | ||
| assetPrefix?: string; | ||
| /** Base path for the application */ | ||
| basePath?: string; | ||
| /** Server-side runtime configuration */ | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| /** Public runtime configuration */ | ||
| publicRuntimeConfig?: Record<string, unknown>; | ||
| /** Webpack configuration function */ | ||
| webpack?: (config: WebpackConfig, options: WebpackConfigContext) => WebpackConfig; | ||
| /** Experimental features */ | ||
| experimental?: Record<string, unknown>; | ||
| /** Environment variables */ | ||
| env?: Record<string, string>; | ||
| /** Rewrites for routing */ | ||
| rewrites?: Array<{ | ||
| source: string; | ||
| destination: string; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| destination: string; | ||
| }>>); | ||
| /** Redirects for routing */ | ||
| redirects?: Array<{ | ||
| source: string; | ||
| destination: string; | ||
| permanent?: boolean; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| destination: string; | ||
| permanent?: boolean; | ||
| }>>); | ||
| /** Headers configuration */ | ||
| headers?: Array<{ | ||
| source: string; | ||
| headers: Array<{ | ||
| key: string; | ||
| value: string; | ||
| }>; | ||
| }> | (() => Promise<Array<{ | ||
| source: string; | ||
| headers: Array<{ | ||
| key: string; | ||
| value: string; | ||
| }>; | ||
| }>>); | ||
| /** Image optimization configuration */ | ||
| images?: { | ||
| domains?: string[]; | ||
| loader?: 'default' | 'imgix' | 'cloudinary' | 'akamai' | 'custom'; | ||
| path?: string; | ||
| deviceSizes?: number[]; | ||
| imageSizes?: number[]; | ||
| minimumCacheTTL?: number; | ||
| formats?: ('image/avif' | 'image/webp')[]; | ||
| dangerouslyAllowSVG?: boolean; | ||
| contentSecurityPolicy?: string; | ||
| }; | ||
| /** TypeScript configuration */ | ||
| typescript?: { | ||
| ignoreBuildErrors?: boolean; | ||
| }; | ||
| /** ESLint configuration */ | ||
| eslint?: { | ||
| ignoreDuringBuilds?: boolean; | ||
| }; | ||
| /** Output configuration */ | ||
| output?: 'standalone' | 'export'; | ||
| /** Other configuration options */ | ||
| [key: string]: unknown; | ||
| } | ||
| /** | ||
| * next-images - Import images in Next.js | ||
| * | ||
| * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif) | ||
| * in your Next.js project using webpack file-loader and url-loader. | ||
| * | ||
| * @packageDocumentation | ||
| * | ||
| * @deprecated | ||
| * This package is deprecated. Next.js 10+ includes a built-in Image component | ||
| * that provides automatic image optimization, lazy loading, and better performance. | ||
| * Consider migrating to next/image instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| * | ||
| * @license MIT | ||
| * @originalAuthor Aref Aslani (twopluszero) | ||
| * @originalRepo https://github.com/twopluszero/next-images | ||
| */ | ||
| /** | ||
| * Configuration options for the withImages plugin | ||
| */ | ||
| interface WithImagesOptions { | ||
| /** | ||
| * Maximum file size (in bytes) for inlining images as Base64. | ||
| * Images smaller than this limit will be inlined as data URLs. | ||
| * Set to `false` to disable inlining entirely. | ||
| * @default 8192 (8KB) | ||
| */ | ||
| inlineImageLimit?: number | false; | ||
| /** | ||
| * Asset prefix for serving images from a CDN or external domain. | ||
| * @see https://nextjs.org/docs/api-reference/next.config.js/cdn-support-with-asset-prefix | ||
| */ | ||
| assetPrefix?: string; | ||
| /** | ||
| * Base path for the application. | ||
| * @see https://nextjs.org/docs/api-reference/next.config.js/basepath | ||
| */ | ||
| basePath?: string; | ||
| /** | ||
| * File extensions to handle with this loader. | ||
| * @default ["jpg", "jpeg", "png", "svg", "gif", "ico", "webp", "jp2", "avif"] | ||
| */ | ||
| fileExtensions?: string[]; | ||
| /** | ||
| * Paths to exclude from the loader. | ||
| * Useful when you want to handle certain files with a different loader (e.g., svg-react-loader). | ||
| */ | ||
| exclude?: RegExp | string; | ||
| /** | ||
| * Template for output file names. | ||
| * @default "[name]-[hash].[ext]" | ||
| * @see https://github.com/webpack/loader-utils#interpolatename | ||
| */ | ||
| name?: string; | ||
| /** | ||
| * Enable ES modules syntax for the output. | ||
| * When enabled, you need to use `.default` when using require(). | ||
| * @default false | ||
| */ | ||
| esModule?: boolean; | ||
| /** | ||
| * Enable dynamic asset prefix resolution at runtime. | ||
| * Useful when assetPrefix can change dynamically. | ||
| * @default false | ||
| */ | ||
| dynamicAssetPrefix?: boolean; | ||
| /** | ||
| * Custom webpack configuration function. | ||
| * This will be merged with the image loader configuration. | ||
| */ | ||
| webpack?: NextConfig['webpack']; | ||
| /** | ||
| * Server runtime configuration. | ||
| */ | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| } | ||
| /** | ||
| * Result type of the withImages function - a Next.js configuration object | ||
| */ | ||
| type WithImagesResult = NextConfig & { | ||
| serverRuntimeConfig?: Record<string, unknown>; | ||
| }; | ||
| /** | ||
| * Default file extensions supported by the loader | ||
| */ | ||
| declare const DEFAULT_FILE_EXTENSIONS: readonly ["jpg", "jpeg", "png", "svg", "gif", "ico", "webp", "jp2", "avif"]; | ||
| /** | ||
| * Default inline image limit (8KB) | ||
| */ | ||
| declare const DEFAULT_INLINE_IMAGE_LIMIT = 8192; | ||
| /** | ||
| * Default output file name template | ||
| */ | ||
| declare const DEFAULT_NAME = "[name]-[hash].[ext]"; | ||
| /** | ||
| * Next.js plugin for importing images in your project. | ||
| * | ||
| * This function wraps your Next.js configuration and adds webpack rules | ||
| * for handling image files using url-loader (for small images) and file-loader | ||
| * (for larger images). | ||
| * | ||
| * @param nextConfig - Your existing Next.js configuration options | ||
| * @returns Modified Next.js configuration with image handling | ||
| * | ||
| * @example | ||
| * ```js | ||
| * // next.config.js | ||
| * const withImages = require('next-images'); | ||
| * | ||
| * module.exports = withImages(); | ||
| * ``` | ||
| * | ||
| * @example | ||
| * ```js | ||
| * // With custom options | ||
| * const withImages = require('next-images'); | ||
| * | ||
| * module.exports = withImages({ | ||
| * inlineImageLimit: 16384, | ||
| * fileExtensions: ['jpg', 'png', 'svg'], | ||
| * webpack(config, options) { | ||
| * // Additional webpack configuration | ||
| * return config; | ||
| * } | ||
| * }); | ||
| * ``` | ||
| * | ||
| * @deprecated | ||
| * Consider using Next.js built-in Image component instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| */ | ||
| declare function withImages(nextConfig?: WithImagesOptions): WithImagesResult; | ||
| export { DEFAULT_FILE_EXTENSIONS, DEFAULT_INLINE_IMAGE_LIMIT, DEFAULT_NAME, type NextConfig, type WebpackConfig, type WebpackConfigContext, type WithImagesOptions, type WithImagesResult, withImages as default, withImages }; |
+119
| var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { | ||
| get: (a, b) => (typeof require !== "undefined" ? require : a)[b] | ||
| }) : x)(function(x) { | ||
| if (typeof require !== "undefined") return require.apply(this, arguments); | ||
| throw Error('Dynamic require of "' + x + '" is not supported'); | ||
| }); | ||
| // src/index.ts | ||
| var DEFAULT_FILE_EXTENSIONS = [ | ||
| "jpg", | ||
| "jpeg", | ||
| "png", | ||
| "svg", | ||
| "gif", | ||
| "ico", | ||
| "webp", | ||
| "jp2", | ||
| "avif" | ||
| ]; | ||
| var DEFAULT_INLINE_IMAGE_LIMIT = 8192; | ||
| var DEFAULT_NAME = "[name]-[hash].[ext]"; | ||
| function withImages(nextConfig = {}) { | ||
| const { | ||
| dynamicAssetPrefix = false, | ||
| inlineImageLimit = DEFAULT_INLINE_IMAGE_LIMIT, | ||
| assetPrefix = "", | ||
| basePath = "", | ||
| fileExtensions = [...DEFAULT_FILE_EXTENSIONS], | ||
| exclude, | ||
| name = DEFAULT_NAME, | ||
| esModule = false, | ||
| ...restConfig | ||
| } = nextConfig; | ||
| return Object.assign({}, restConfig, { | ||
| // Configure server runtime config for dynamic asset prefix | ||
| serverRuntimeConfig: dynamicAssetPrefix ? Object.assign({}, nextConfig.serverRuntimeConfig, { | ||
| nextImagesAssetPrefix: assetPrefix || basePath | ||
| }) : nextConfig.serverRuntimeConfig, | ||
| /** | ||
| * Webpack configuration modifier | ||
| * Adds rules for handling image files | ||
| */ | ||
| webpack(config, options) { | ||
| const { isServer } = options; | ||
| if (!options.defaultLoaders) { | ||
| throw new Error( | ||
| "This plugin is not compatible with Next.js versions below 5.0.0. Please upgrade Next.js to version 5.0.0 or higher. See: https://nextjs.org/docs/migrating" | ||
| ); | ||
| } | ||
| const extensionsPattern = fileExtensions.join("|"); | ||
| const testRegex = new RegExp(`\\.(${extensionsPattern})$`); | ||
| const issuerRegex = new RegExp("\\.\\w+(?<!(s?c|sa)ss)$", "i"); | ||
| const imageRule = { | ||
| test: testRegex, | ||
| issuer: issuerRegex, | ||
| exclude, | ||
| use: [ | ||
| { | ||
| loader: __require.resolve("url-loader"), | ||
| options: { | ||
| // Inline images below the limit as Base64 | ||
| limit: inlineImageLimit === false ? -1 : inlineImageLimit, | ||
| // Use file-loader for images above the limit | ||
| fallback: __require.resolve("file-loader"), | ||
| // Output path for image files | ||
| outputPath: `${isServer ? "../" : ""}static/images/`, | ||
| // Public path configuration | ||
| ...dynamicAssetPrefix ? { | ||
| // Dynamic public path for runtime resolution | ||
| publicPath: `${isServer ? "/_next/" : ""}static/images/`, | ||
| postTransformPublicPath: (p) => { | ||
| if (isServer) { | ||
| return `(require("next/config").default().serverRuntimeConfig.nextImagesAssetPrefix || '') + ${p}`; | ||
| } | ||
| return `(__webpack_public_path__ || '') + ${p}`; | ||
| } | ||
| } : { | ||
| // Static public path from config | ||
| publicPath: `${assetPrefix || basePath || ""}/_next/static/images/` | ||
| }, | ||
| // Output file name template | ||
| name, | ||
| // ES modules syntax | ||
| esModule | ||
| } | ||
| } | ||
| ] | ||
| }; | ||
| config.module.rules.push(imageRule); | ||
| if (typeof nextConfig.webpack === "function") { | ||
| return nextConfig.webpack(config, options); | ||
| } | ||
| return config; | ||
| } | ||
| }); | ||
| } | ||
| var index_default = withImages; | ||
| /** | ||
| * next-images - Import images in Next.js | ||
| * | ||
| * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif) | ||
| * in your Next.js project using webpack file-loader and url-loader. | ||
| * | ||
| * @packageDocumentation | ||
| * | ||
| * @deprecated | ||
| * This package is deprecated. Next.js 10+ includes a built-in Image component | ||
| * that provides automatic image optimization, lazy loading, and better performance. | ||
| * Consider migrating to next/image instead. | ||
| * @see https://nextjs.org/docs/api-reference/next/image | ||
| * | ||
| * @license MIT | ||
| * @originalAuthor Aref Aslani (twopluszero) | ||
| * @originalRepo https://github.com/twopluszero/next-images | ||
| */ | ||
| export { DEFAULT_FILE_EXTENSIONS, DEFAULT_INLINE_IMAGE_LIMIT, DEFAULT_NAME, index_default as default, withImages }; | ||
| //# sourceMappingURL=index.js.map | ||
| //# sourceMappingURL=index.js.map |
| {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["/**\n * next-images - Import images in Next.js\n *\n * This package allows you to import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif)\n * in your Next.js project using webpack file-loader and url-loader.\n *\n * @packageDocumentation\n *\n * @deprecated\n * This package is deprecated. Next.js 10+ includes a built-in Image component\n * that provides automatic image optimization, lazy loading, and better performance.\n * Consider migrating to next/image instead.\n * @see https://nextjs.org/docs/api-reference/next/image\n *\n * @license MIT\n * @originalAuthor Aref Aslani (twopluszero)\n * @originalRepo https://github.com/twopluszero/next-images\n */\n\nimport type { NextConfig, WebpackConfig, WebpackConfigContext } from './types';\n\nexport type { NextConfig, WebpackConfig, WebpackConfigContext } from './types';\n\n/**\n * Configuration options for the withImages plugin\n */\nexport interface WithImagesOptions {\n /**\n * Maximum file size (in bytes) for inlining images as Base64.\n * Images smaller than this limit will be inlined as data URLs.\n * Set to `false` to disable inlining entirely.\n * @default 8192 (8KB)\n */\n inlineImageLimit?: number | false;\n\n /**\n * Asset prefix for serving images from a CDN or external domain.\n * @see https://nextjs.org/docs/api-reference/next.config.js/cdn-support-with-asset-prefix\n */\n assetPrefix?: string;\n\n /**\n * Base path for the application.\n * @see https://nextjs.org/docs/api-reference/next.config.js/basepath\n */\n basePath?: string;\n\n /**\n * File extensions to handle with this loader.\n * @default [\"jpg\", \"jpeg\", \"png\", \"svg\", \"gif\", \"ico\", \"webp\", \"jp2\", \"avif\"]\n */\n fileExtensions?: string[];\n\n /**\n * Paths to exclude from the loader.\n * Useful when you want to handle certain files with a different loader (e.g., svg-react-loader).\n */\n exclude?: RegExp | string;\n\n /**\n * Template for output file names.\n * @default \"[name]-[hash].[ext]\"\n * @see https://github.com/webpack/loader-utils#interpolatename\n */\n name?: string;\n\n /**\n * Enable ES modules syntax for the output.\n * When enabled, you need to use `.default` when using require().\n * @default false\n */\n esModule?: boolean;\n\n /**\n * Enable dynamic asset prefix resolution at runtime.\n * Useful when assetPrefix can change dynamically.\n * @default false\n */\n dynamicAssetPrefix?: boolean;\n\n /**\n * Custom webpack configuration function.\n * This will be merged with the image loader configuration.\n */\n webpack?: NextConfig['webpack'];\n\n /**\n * Server runtime configuration.\n */\n serverRuntimeConfig?: Record<string, unknown>;\n}\n\n/**\n * Result type of the withImages function - a Next.js configuration object\n */\nexport type WithImagesResult = NextConfig & {\n serverRuntimeConfig?: Record<string, unknown>;\n};\n\n/**\n * Default file extensions supported by the loader\n */\nexport const DEFAULT_FILE_EXTENSIONS = [\n 'jpg',\n 'jpeg',\n 'png',\n 'svg',\n 'gif',\n 'ico',\n 'webp',\n 'jp2',\n 'avif',\n] as const;\n\n/**\n * Default inline image limit (8KB)\n */\nexport const DEFAULT_INLINE_IMAGE_LIMIT = 8192;\n\n/**\n * Default output file name template\n */\nexport const DEFAULT_NAME = '[name]-[hash].[ext]';\n\n/**\n * Next.js plugin for importing images in your project.\n *\n * This function wraps your Next.js configuration and adds webpack rules\n * for handling image files using url-loader (for small images) and file-loader\n * (for larger images).\n *\n * @param nextConfig - Your existing Next.js configuration options\n * @returns Modified Next.js configuration with image handling\n *\n * @example\n * ```js\n * // next.config.js\n * const withImages = require('next-images');\n *\n * module.exports = withImages();\n * ```\n *\n * @example\n * ```js\n * // With custom options\n * const withImages = require('next-images');\n *\n * module.exports = withImages({\n * inlineImageLimit: 16384,\n * fileExtensions: ['jpg', 'png', 'svg'],\n * webpack(config, options) {\n * // Additional webpack configuration\n * return config;\n * }\n * });\n * ```\n *\n * @deprecated\n * Consider using Next.js built-in Image component instead.\n * @see https://nextjs.org/docs/api-reference/next/image\n */\nfunction withImages(nextConfig: WithImagesOptions = {}): WithImagesResult {\n const {\n dynamicAssetPrefix = false,\n inlineImageLimit = DEFAULT_INLINE_IMAGE_LIMIT,\n assetPrefix = '',\n basePath = '',\n fileExtensions = [...DEFAULT_FILE_EXTENSIONS],\n exclude,\n name = DEFAULT_NAME,\n esModule = false,\n ...restConfig\n } = nextConfig;\n\n return Object.assign({}, restConfig as NextConfig, {\n // Configure server runtime config for dynamic asset prefix\n serverRuntimeConfig: dynamicAssetPrefix\n ? Object.assign({}, nextConfig.serverRuntimeConfig, {\n nextImagesAssetPrefix: assetPrefix || basePath,\n })\n : nextConfig.serverRuntimeConfig,\n\n /**\n * Webpack configuration modifier\n * Adds rules for handling image files\n */\n webpack(config: WebpackConfig, options: WebpackConfigContext): WebpackConfig {\n const { isServer } = options;\n\n // Check for Next.js version compatibility\n if (!options.defaultLoaders) {\n throw new Error(\n 'This plugin is not compatible with Next.js versions below 5.0.0. ' +\n 'Please upgrade Next.js to version 5.0.0 or higher. ' +\n 'See: https://nextjs.org/docs/migrating'\n );\n }\n\n // Create regex pattern for matching image file extensions\n const extensionsPattern = fileExtensions.join('|');\n const testRegex = new RegExp(`\\\\.(${extensionsPattern})$`);\n\n // Issuer pattern: Next.js already handles url() in CSS/SCSS/SASS files\n // We only want to handle images imported from JS/TS files\n const issuerRegex = new RegExp('\\\\.\\\\w+(?<!(s?c|sa)ss)$', 'i');\n\n // Build the webpack rule for image files\n const imageRule = {\n test: testRegex,\n issuer: issuerRegex,\n exclude: exclude,\n use: [\n {\n loader: require.resolve('url-loader'),\n options: {\n // Inline images below the limit as Base64\n limit: inlineImageLimit === false ? -1 : inlineImageLimit,\n // Use file-loader for images above the limit\n fallback: require.resolve('file-loader'),\n // Output path for image files\n outputPath: `${isServer ? '../' : ''}static/images/`,\n // Public path configuration\n ...(dynamicAssetPrefix\n ? {\n // Dynamic public path for runtime resolution\n publicPath: `${isServer ? '/_next/' : ''}static/images/`,\n postTransformPublicPath: (p: string): string => {\n if (isServer) {\n // On server, resolve asset prefix from runtime config\n return `(require(\"next/config\").default().serverRuntimeConfig.nextImagesAssetPrefix || '') + ${p}`;\n }\n // On client, use webpack public path\n return `(__webpack_public_path__ || '') + ${p}`;\n },\n }\n : {\n // Static public path from config\n publicPath: `${assetPrefix || basePath || ''}/_next/static/images/`,\n }),\n // Output file name template\n name: name,\n // ES modules syntax\n esModule: esModule,\n },\n },\n ],\n };\n\n // Add the image rule to webpack config\n config.module.rules.push(imageRule);\n\n // Call user's custom webpack function if provided\n if (typeof nextConfig.webpack === 'function') {\n return nextConfig.webpack(config, options);\n }\n\n return config;\n },\n });\n}\n\nexport { withImages };\n\n// Default export for CommonJS compatibility\nexport default withImages;"]} |
+12
-0
| # @opensourceframework/next-images | ||
| ## 1.9.0 | ||
| ### Minor Changes | ||
| - 8d7f5c3: v1.8.8 release - Full image loader implementation | ||
| Complete implementation of image optimization for Next.js with: | ||
| - Custom image loader configuration | ||
| - Support for various image formats | ||
| - Responsive image handling | ||
| - Comprehensive test suite | ||
| ## 1.8.8 | ||
@@ -4,0 +16,0 @@ |
+5
-4
| { | ||
| "name": "@opensourceframework/next-images", | ||
| "version": "1.8.9", | ||
| "version": "1.9.0", | ||
| "description": "Import images (jpg, jpeg, png, svg, gif, ico, webp, jp2, avif) in Next.js applications. Fork of next-images with TypeScript support.", | ||
@@ -91,8 +91,9 @@ "keywords": [ | ||
| "type": "git", | ||
| "url": "git+https://github.com/riceharvest/next-images.git" | ||
| "url": "git+https://github.com/riceharvest/opensourceframework.git", | ||
| "directory": "packages/next-images" | ||
| }, | ||
| "bugs": { | ||
| "url": "https://github.com/riceharvest/next-images/issues" | ||
| "url": "https://github.com/riceharvest/opensourceframework/issues?q=is%3Aissue+is%3Aopen+next-images" | ||
| }, | ||
| "homepage": "https://github.com/riceharvest/next-images#readme", | ||
| "homepage": "https://github.com/riceharvest/opensourceframework/tree/main/packages/next-images#readme", | ||
| "publishConfig": { | ||
@@ -99,0 +100,0 @@ "access": "public" |
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
URL strings
Supply chain riskPackage contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
No bug tracker
MaintenancePackage does not have a linked bug tracker in package.json.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
63142
275.2%11
120%562
921.82%0
-100%0
-100%1
Infinity%