Merge pull request #859 from dc7290/main

Release
dc7290 · Apr 14, 2024 · ddb8d92 · ddb8d92
2 parents dc771a0 + 48244ee
commit ddb8d92
Show file tree

Hide file tree

Showing 9 changed files with 436 additions and 484 deletions.
diff --git a/__tests__/e2e/export-images.config.js b/__tests__/e2e/export-images.config.js
@@ -1,3 +1,10 @@
+const getRemoteImages = () =>
+  new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(['https://picsum.photos/id/237/200/300.jpg', 'https://picsum.photos/id/238/200/300.jpg'])
+    }, 500)
+  })
+
 /**
  * @type {import('../../src').Config}
  */
@@ -8,7 +15,11 @@ const config = {
     },
   },
   generateFormats: ['avif', 'webp'],
-  remoteImages: async () => ['https://picsum.photos/id/237/200/300.jpg', 'https://picsum.photos/id/238/200/300.jpg'],
+  remoteImages: getRemoteImages,
+  filenameGenerator: ({ path, name, width, extension }) => `${path}/${name}_${width}.${extension}`,
+  sourceImageParser: function ({ src, defaultParser }) {
+    return defaultParser(src)
+  },
   cacheDir: '.next/cache/next-export-optimize-images',
 }
 

diff --git a/docs/docs/04-Configurations/01-basic-configuration.md b/docs/docs/04-Configurations/01-basic-configuration.md
@@ -79,22 +79,21 @@ Please set the same value.
 - Argument: Object
 - Return value: string
 
-| Key       | Type   | Description                                                           | e.g. '/images/sample.png' | e.g. require('./sample.png') |
-| --------- | ------ | --------------------------------------------------------------------- | ------------------------- | ---------------------------- |
-| path      | string | The path portion.                                                     | /images                   | /\_next/static/media         |
-| name      | string | The file name part.                                                   | sample                    | sample.{hash}                |
-| width     | number | That image is the resized width.                                      | 1920                      | 1920                         |
-| quality   | number | The `quality` specified in the `next/image` component. Default is 75. | 75                        | 75                           |
-| extension | string | The extension of that image.                                          | png                       | png                          |
+| Key       | Type   | Description                      | e.g. '/images/sample.png' | e.g. require('./sample.png') |
+| --------- | ------ | -------------------------------- | ------------------------- | ---------------------------- |
+| path      | string | The path portion.                | /images                   | /\_next/static/media         |
+| name      | string | The file name part.              | sample                    | sample.{hash}                |
+| width     | number | That image is the resized width. | 1920                      | 1920                         |
+| extension | string | The extension of that image.     | png                       | png                          |
 
 You can customize the generation of file names.
 
 e.g. '/images/sample.png'
 
 ```js
 const config = {
-  filenameGenerator: ({ path, name, width, quality, extension }) =>
-    `${path.replace(/^\//, '').replace(/\//g, '-')}-${name}.${width}.${quality}.${extension}`,
+  filenameGenerator: ({ path, name, width, extension }) =>
+    `${path.replace(/^\//, '').replace(/\//g, '-')}-${name}.${width}.${extension}`,
 }
 ```
 

diff --git a/docs/package.json b/docs/package.json
@@ -34,10 +34,10 @@
     "clsx": "2.1.0",
     "postcss": "8.4.38",
     "prettier": "3.2.5",
-    "prettier-plugin-tailwindcss": "0.5.12",
+    "prettier-plugin-tailwindcss": "0.5.13",
     "prism-react-renderer": "1.3.5",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "tailwindcss": "3.4.1"
+    "tailwindcss": "3.4.3"
   }
 }
diff --git a/docs/yarn.lock b/docs/yarn.lock
@@ -5863,7 +5863,7 @@ jest-worker@^27.4.5, jest-worker@^27.5.1:
     merge-stream "^2.0.0"
     supports-color "^8.0.0"
 
-jiti@^1.19.1:
+jiti@^1.21.0:
   version "1.21.0"
   resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d"
   integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==
@@ -7139,10 +7139,10 @@ prepend-http@^2.0.0:
   resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-2.0.0.tgz#e92434bfa5ea8c19f41cdfd401d741a3c819d897"
   integrity sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc=
 
-[email protected].12:
-  version "0.5.12"
-  resolved "https://registry.yarnpkg.com/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.5.12.tgz#655999849344548ecf4d9b47a051ed856f041c72"
-  integrity sha512-o74kiDBVE73oHW+pdkFSluHBL3cYEvru5YgEqNkBMFF7Cjv+w1vI565lTlfoJT4VLWDe0FMtZ7FkE/7a4pMXSQ==
+[email protected].13:
+  version "0.5.13"
+  resolved "https://registry.yarnpkg.com/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.5.13.tgz#ee3c1e07848c90abdd1edde36a09366327e31e26"
+  integrity sha512-2tPWHCFNC+WRjAC4SIWQNSOdcL1NNkydXim8w7TDqlZi+/ulZYz2OouAI6qMtkggnPt7lGamboj6LcTMwcCvoQ==
 
 [email protected]:
   version "3.2.5"
@@ -8285,10 +8285,10 @@ svgo@^2.5.0, svgo@^2.7.0:
     picocolors "^1.0.0"
     stable "^0.1.8"
 
-[email protected].1:
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.1.tgz#f512ca5d1dd4c9503c7d3d28a968f1ad8f5c839d"
-  integrity sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==
+[email protected].3:
+  version "3.4.3"
+  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.3.tgz#be48f5283df77dfced705451319a5dffb8621519"
+  integrity sha512-U7sxQk/n397Bmx4JHbJx/iSOOv5G+II3f1kpLpY2QeUv5DcPdcTsYLlusZfq1NthHS1c1cZoyFmmkex1rzke0A==
   dependencies:
     "@alloc/quick-lru" "^5.2.0"
     arg "^5.0.2"
@@ -8298,7 +8298,7 @@ [email protected]:
     fast-glob "^3.3.0"
     glob-parent "^6.0.2"
     is-glob "^4.0.3"
-    jiti "^1.19.1"
+    jiti "^1.21.0"
     lilconfig "^2.1.0"
     micromatch "^4.0.5"
     normalize-path "^3.0.0"

diff --git a/package.json b/package.json
@@ -66,42 +66,42 @@
     "@semantic-release/changelog": "6.0.3",
     "@semantic-release/git": "10.0.1",
     "@testing-library/jest-dom": "6.4.2",
-    "@testing-library/react": "14.2.1",
+    "@testing-library/react": "15.0.2",
     "@tsconfig/strictest": "2.0.5",
     "@types/app-root-path": "1.2.8",
     "@types/cli-progress": "3.11.5",
     "@types/fs-extra": "11.0.4",
     "@types/jest": "29.5.12",
     "@types/lodash.uniqwith": "4.5.9",
-    "@types/node": "20.11.25",
-    "@types/react": "18.2.77",
+    "@types/node": "20.12.7",
+    "@types/react": "18.2.78",
     "@types/recursive-readdir": "^2.2.4",
     "@types/sharp": "0.32.0",
-    "@typescript-eslint/eslint-plugin": "6.21.0",
-    "@typescript-eslint/parser": "6.21.0",
+    "@typescript-eslint/eslint-plugin": "7.6.0",
+    "@typescript-eslint/parser": "7.6.0",
     "conventional-changelog-conventionalcommits": "6.1.0",
-    "eslint": "8.57.0",
+    "eslint": "9.0.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-import": "2.29.1",
-    "eslint-plugin-jest": "27.9.0",
-    "eslint-plugin-jest-dom": "^5.1.0",
+    "eslint-plugin-jest": "28.2.0",
+    "eslint-plugin-jest-dom": "^5.2.0",
     "eslint-plugin-testing-library": "6.2.1",
     "git-cz": "4.9.0",
     "husky": "9.0.11",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
     "lint-staged": "15.2.2",
-    "next": "14.1.4",
-    "npm-run-all": "^4.1.5",
+    "next": "14.2.1",
+    "npm-run-all2": "^6.1.2",
     "prettier": "3.2.5",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "rimraf": "5.0.5",
     "semantic-release": "19.0.5",
     "ts-jest": "29.1.2",
     "tsup": "^8.0.2",
-    "typescript": "5.4.2",
-    "webpack": "5.90.3"
+    "typescript": "5.4.5",
+    "webpack": "5.91.0"
   },
   "peerDependencies": {
     "next": ">=14.1.0",

diff --git a/src/utils/getConfig.ts b/src/utils/getConfig.ts
@@ -118,8 +118,29 @@ export type Config = {
   mode?: 'build' | 'export'
 }
 
-const getConfig = (): Config => {
-  return require('next-export-optimize-images/export-images.config.js')
+type ResolvedConfig = Config & {
+  remoteImages?: string[]
+}
+
+const getConfig = (): ResolvedConfig => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const config = require('next-export-optimize-images/export-images.config.js') as Omit<
+    ResolvedConfig,
+    'filenameGenerator' | 'sourceImageParser'
+  > & {
+    filenameGenerator?: string
+    sourceImageParser?: string
+  }
+
+  return {
+    ...config,
+    filenameGenerator: config.filenameGenerator
+      ? Function('"use strict";return (' + config.filenameGenerator + ')')()
+      : undefined,
+    sourceImageParser: config.sourceImageParser
+      ? Function('"use strict";return (' + config.sourceImageParser + ')')()
+      : undefined,
+  }
 }
 
 export default getConfig
diff --git a/src/withExportImages.ts b/src/withExportImages.ts
@@ -5,7 +5,12 @@ import appRootPath from 'app-root-path'
 import fs from 'fs-extra'
 import type { NextConfig } from 'next'
 
-const withExportImages = (nextConfig: NextConfig = {}, options: { __test?: boolean } = {}): NextConfig => {
+import { Config } from './utils/getConfig'
+
+const withExportImages = async (
+  nextConfig: NextConfig = {},
+  options: { __test?: boolean } = {}
+): Promise<NextConfig> => {
   if (nextConfig.images?.unoptimized) {
     throw Error(
       'The `images.unoptimized` is not supported. If you use this option, consider not using `next-export-optimize-images`.'
@@ -15,11 +20,34 @@ const withExportImages = (nextConfig: NextConfig = {}, options: { __test?: boole
   const resolvedConfigPath = path.join(process.cwd(), 'export-images.config.js')
   const existConfig = fs.existsSync(resolvedConfigPath)
   const destConfigPath = appRootPath.resolve('node_modules/next-export-optimize-images/export-images.config.js')
+
+  let config: Config = {}
   if (existConfig) {
-    fs.copySync(resolvedConfigPath, destConfigPath)
-  } else {
-    fs.writeFileSync(destConfigPath, 'module.exports = {}')
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const configSrc = require(resolvedConfigPath) as Config
+    config = configSrc
+    if (configSrc.remoteImages) {
+      if (typeof configSrc.remoteImages === 'function') {
+        config.remoteImages = await configSrc.remoteImages()
+      }
+    }
   }
+
+  fs.ensureFileSync(destConfigPath)
+  fs.writeFileSync(
+    destConfigPath,
+    `module.exports = ${JSON.stringify(
+      config,
+      (k, v) => {
+        if (k === 'filenameGenerator' || k === 'sourceImageParser') {
+          return v.toString()
+        }
+        return v
+      },
+      2
+    )}`
+  )
+
   // eslint-disable-next-line no-console
   console.log(
     colors.magenta(

diff --git a/tsconfig.json b/tsconfig.json
@@ -9,5 +9,5 @@
     "baseUrl": "."
   },
   "include": ["src/**/*", "__tests__/**/*", "jest-setup.ts", "types/**/*"],
-  "exclude": ["node_modules", "dist", "__tests__/e2e/**/*"]
+  "exclude": ["node_modules", "dist", "__tests__/e2e/**/*", "__tests__/e2e-build/**/*"]
 }