feat: swap publish/static dirs (#93)

* feat: swap publish/static dirs * fix: move redirects to onPostBuild * chore: add test for static assets * chore: fix e2e test

Author: orinokai

src/build/config.ts

@@ -2,7 +2,7 @@ import type { NetlifyPluginConstants, NetlifyPluginOptions } from '@netlify/buil
 import type { PrerenderManifest } from 'next/dist/build/index.js'
 import { readFile } from 'node:fs/promises'
 import { resolve } from 'node:path'
-import { SERVER_HANDLER_NAME, STATIC_DIR } from './constants.js'
+import { SERVER_HANDLER_NAME } from './constants.js'
 
 export const getPrerenderManifest = async ({
  PUBLISH_DIR,
@@ -13,12 +13,13 @@ export const getPrerenderManifest = async ({
 /**
  * Enable Next.js standalone mode at build time
  */
-export const setBuildConfig = () => {
+export const setPreBuildConfig = () => {
  process.env.NEXT_PRIVATE_STANDALONE = 'true'
 }
 
-export const setDeployConfig = ({ netlifyConfig }: Pick<NetlifyPluginOptions, 'netlifyConfig'>) => {
- netlifyConfig.build.publish = STATIC_DIR
+export const setPostBuildConfig = ({
+ netlifyConfig,
+}: Pick<NetlifyPluginOptions, 'netlifyConfig'>) => {
  netlifyConfig.redirects ||= []
  netlifyConfig.redirects.push({
  from: '/*',

src/build/constants.ts

@@ -11,6 +11,7 @@ export const PLUGIN_NAME = pkg.name
 export const PLUGIN_VERSION = pkg.version
 
 export const STATIC_DIR = '.netlify/static'
+export const TEMP_DIR = '.netlify/temp'
 
 export const SERVER_FUNCTIONS_DIR = '.netlify/functions-internal'
 export const SERVER_HANDLER_NAME = '_netlify-server-handler'

src/build/content/static.ts

@@ -2,12 +2,12 @@ import type { NetlifyPluginOptions } from '@netlify/build'
 import glob from 'fast-glob'
 import type { PrerenderManifest } from 'next/dist/build/index.js'
 import { existsSync } from 'node:fs'
-import { cp, readFile, rm } from 'node:fs/promises'
+import { cp, mkdir, readFile, rename, rm } from 'node:fs/promises'
 import { basename, dirname, resolve } from 'node:path'
 import { join as joinPosix } from 'node:path/posix'
 import { getBlobStore } from '../blob.js'
 import { getPrerenderManifest } from '../config.js'
-import { STATIC_DIR } from '../constants.js'
+import { STATIC_DIR, TEMP_DIR } from '../constants.js'
 
 export const uploadStaticContent = async ({
  constants: { PUBLISH_DIR, NETLIFY_API_TOKEN, NETLIFY_API_HOST, SITE_ID },
@@ -63,3 +63,18 @@ export const copyStaticAssets = async ({
  })
  }
 }
+
+export const publishStaticDir = async ({
+ constants: { PUBLISH_DIR },
+}: Pick<NetlifyPluginOptions, 'constants'>): Promise<void> => {
+ await mkdir(resolve(TEMP_DIR, 'publish'), { recursive: true })
+ await rename(resolve(PUBLISH_DIR), resolve(TEMP_DIR, 'publish'))
+ await rename(resolve(STATIC_DIR), resolve(PUBLISH_DIR))
+}
+
+export const unpublishStaticDir = async ({
+ constants: { PUBLISH_DIR },
+}: Pick<NetlifyPluginOptions, 'constants'>): Promise<void> => {
+ await rename(resolve(PUBLISH_DIR), resolve(STATIC_DIR))
+ await rename(resolve(TEMP_DIR, 'publish'), resolve(PUBLISH_DIR))
+}

src/index.ts

@@ -1,13 +1,18 @@
 import type { NetlifyPluginOptions } from '@netlify/build'
 import { restoreBuildCache, saveBuildCache } from './build/cache.js'
-import { setBuildConfig, setDeployConfig } from './build/config.js'
+import { setPostBuildConfig, setPreBuildConfig } from './build/config.js'
 import { uploadPrerenderedContent } from './build/content/prerendered.js'
-import { copyStaticAssets, uploadStaticContent } from './build/content/static.js'
+import {
+ copyStaticAssets,
+ publishStaticDir,
+ unpublishStaticDir,
+ uploadStaticContent,
+} from './build/content/static.js'
 import { createServerHandler } from './build/functions/server.js'
 
 export const onPreBuild = async ({ constants, utils }: NetlifyPluginOptions) => {
+ setPreBuildConfig()
  await restoreBuildCache({ constants, utils })
- setBuildConfig()
 }
 
 export const onBuild = async ({ constants, utils }: NetlifyPluginOptions) => {
@@ -22,6 +27,11 @@ export const onBuild = async ({ constants, utils }: NetlifyPluginOptions) => {
  ])
 }
 
-export const onPostBuild = ({ netlifyConfig }: NetlifyPluginOptions) => {
- setDeployConfig({ netlifyConfig })
+export const onPostBuild = async ({ constants, netlifyConfig }: NetlifyPluginOptions) => {
+ setPostBuildConfig({ netlifyConfig })
+ await publishStaticDir({ constants })
+}
+
+export const onEnd = async ({ constants }: NetlifyPluginOptions) => {
+ await unpublishStaticDir({ constants })
 }

tests/e2e/simple-app.test.ts

@@ -1,4 +1,4 @@
-import { test, expect } from '@playwright/test'
+import { expect, test } from '@playwright/test'
 import { createE2EFixture } from '../utils/create-e2e-fixture.js'
 
 let ctx: Awaited<ReturnType<typeof createE2EFixture>>
@@ -17,7 +17,14 @@ test.describe('simple-next-app', () => {
 
  await expect(page).toHaveTitle('Simple Next App')
 
- const h1 = await page.locator('h1')
+ const h1 = page.locator('h1')
  await expect(h1).toHaveText('Home')
  })
+
+ test('Serves a static image correctly', async ({ page }) => {
+ const response = await page.goto(`${ctx.url}/next.svg`)
+
+ expect(response?.status()).toBe(200)
+ expect(response?.headers()['content-type']).toBe('image/svg+xml')
+ })
 })