Question

Nitro 通过 `public/` 目录处理资产。

Public Assets

public/ 目录中的所有资产将自动提供。

md

public/
  image.png     <-- /image.png
  video.mp4     <-- /video.mp4
  robots.txt    <-- /robots.txt
package.json
nitro.config.ts

使用 Nitro 构建时，它会将 public/ 目录复制到 .output/public/ 并创建一个包含元数据的清单：

json

{
  "/image.png": {
    "type": "image/png",
    "etag": "\"4a0c-6utWq0Kbk5OqDmksYCa9XV8irnM\"",
    "mtime": "2023-03-04T21:39:45.086Z",
    "size": 18956
  },
  "/robots.txt": {
    "type": "text/plain; charset=utf-8",
    "etag": "\"8-hMqyDrA8fJ0R904zgEPs3L55Jls\"",
    "mtime": "2023-03-04T21:39:45.086Z",
    "size": 8
  },
  "/video.mp4": {
    "type": "video/mp4",
    "etag": "\"9b943-4UwfQXKUjPCesGPr6J5j7GzNYGU\"",
    "mtime": "2023-03-04T21:39:45.085Z",
    "size": 637251
  }
}

这使 Nitro 无需扫描目录即可了解公共资产，从而通过缓存标头提供高性能。

Server Assets

assets/ 目录中的所有资产都将添加到服务器包中。

它们可以通过使用 useStorage('assets:server') 的 assets:server 挂载点来寻址

Keys can be written assets/server/my_file_path or assets:server:my_file_path.

Custom Server Assets

In order to add assets from a custom directory, path will need to be defined in the nitro config:

nitro.config.ts

import { defineNitroConfig } from 'nitropack/config'

export default defineNitroConfig({
  serverAssets: [{
    baseName: 'my_directory',
    dir: './server/my_directory'
  }]
})

nuxt.config.ts

export default defineNuxtConfig({
  nitro: {
    serverAssets: [{
      baseName: 'my_directory',
      dir: './server/my_directory'
    }]
  }
})

They can be addressed by the key assets/my_directory/.

Examples

Example: Retrieving a json data from default assets directory:

js

export default defineEventHandler(async () => {
  const data = await useStorage().getItem(`assets/server/data.json`)
  return data
})

Example: Retrieving a html file from a custom assets directory:

nitro.config.ts

import { defineNitroConfig } from 'nitropack/config'

export default defineNitroConfig({
  serverAssets: [{
    baseName: 'templates',
    dir: './templates' // Relative to `srcDir` (`server/` for nuxt)
  }]
})

nuxt.config.ts

export default defineNuxtConfig({
  nitro: {
    serverAssets: [{
      baseName: 'templates',
      dir: './templates' // Relative to `srcDir` (`server/` for nuxt)
    }]
  }
})

js

// routes/success.ts
export default defineEventHandler(async (event) => {
  return await useStorage().getItem(`assets/templates/success.html`)
  // or
  return await useStorage('assets:templates').getItem(`success.html`)
})