feature: 实现了对nextjs增加插件的功能

vercel · May 11, 2024 · 66e84fa · 66e84fa
1 parent 9084a09
commit 66e84fa
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 1 deletion.
diff --git a/packages/next/src/export/index.ts b/packages/next/src/export/index.ts
@@ -58,6 +58,7 @@ import { TurborepoAccessTraceResult } from '../build/turborepo-access-trace'
 import { createProgress } from '../build/progress'
 import type { DeepReadonly } from '../shared/lib/deep-readonly'
 import { checkIsAppPPREnabled } from '../server/lib/experimental/ppr'
+import type { PluginConfig } from '../server/config-shared'
 
 export class ExportError extends Error {
   code = 'NEXT_EXPORT_ERROR'
@@ -69,6 +70,31 @@ type ExportWorkers = {
   end: () => Promise<void>
 }
 
+async function processHtmlWithPlugin(htmlSrc: string, htmlDest: string, plugin: PluginConfig) {
+  const { generateBundle } = plugin
+  const pluginOptions = {}
+  try {
+    // 读取HTML源文件
+    const htmlContent = await fs.readFile(htmlSrc, 'utf8');
+
+    // 使用插件处理HTML内容
+    if (generateBundle) {
+      const resolvedBundle = generateBundle(pluginOptions, htmlContent)
+      let modifiedHtmlContent;
+      if (resolvedBundle instanceof Promise) {
+        modifiedHtmlContent = await resolvedBundle
+      } else {
+        modifiedHtmlContent = resolvedBundle
+      }
+
+      // 将修改后的HTML内容写入目标文件
+      await fs.writeFile(htmlDest, modifiedHtmlContent, 'utf8');
+    }
+  } catch (err) {
+    console.error('An error occurred:', err);
+  }
+}
+
 function setupWorkers(
   options: ExportAppOptions,
   nextConfig: NextConfigComplete
@@ -778,7 +804,13 @@ export async function exportAppImpl(
         const htmlSrc = `${orig}.html`
         const jsonSrc = `${orig}${isAppPath ? RSC_SUFFIX : '.json'}`
 
-        await fs.copyFile(htmlSrc, htmlDest)
+        // await fs.copyFile(htmlSrc, htmlDest)
+        nextConfig.plugins.forEach((plugin: PluginConfig) => {
+          processHtmlWithPlugin(htmlSrc, htmlDest, plugin)
+            .catch(err => {
+              console.error('An error occurred:', err);
+            });
+        })
         await fs.copyFile(jsonSrc, jsonDest)
 
         if (existsSync(`${orig}.amp.html`)) {

diff --git a/packages/next/src/server/config-shared.ts b/packages/next/src/server/config-shared.ts
@@ -481,6 +481,11 @@ export type ExportPathMap = {
   }
 }
 
+export interface PluginConfig {
+  name?: string
+  generateBundle?: (outputOptions: Record<string, any>, bundle: string) => Promise<string> | string
+}
+
 /**
  * Next.js can be configured through a `next.config.js` file in the root of your project directory.
  *
@@ -828,6 +833,41 @@ export interface NextConfig extends Record<string, any> {
    * @see https://nextjs.org/docs/app/api-reference/next-config-js/serverExternalPackages
    */
   serverExternalPackages?: string[]
+
+  // custom plugins
+  /**
+   * next.plugin.js
+   *  const prettier = require('prettier')
+    function nextPlugin() {
+      // 这里是插件的初始化代码，可以处理 options 参数
+
+      // 返回一个对象，包含插件的钩子函数
+      return {
+        name: 'my-next-plugin', // 插件名称
+
+        // 示例：修改构建输出的代码
+        generateBundle(outputOptions, bundle) {
+          return prettier.format(bundle, {
+            parser: 'html',
+            printWidth: 1000
+          })
+        },
+      };
+    }
+
+    module.exports = nextPlugin;
+
+   *
+    const nextPlugin = require('./next.plugin.js')
+
+    const nextConfig = {
+      output: 'export',
+      plugins: [
+        nextPlugin()
+      ]
+    }
+  */
+  plugins?: PluginConfig[]
 }
 
 export const defaultConfig: NextConfig = {