0.0.7 • Published 7 months ago
@schemasset/nuxt v0.0.7
@schemasset/nuxt
Nuxt module for schemasset - schema-based asset file validation
Overview
@schemasset/nuxt is a Nuxt module for validating asset files (images, icons, fonts, etc.) based on schema definitions within your Nuxt project. Using this module, you can verify that the asset files in your project match the expected structure, and receive warnings or errors during the build process if there are issues.
Features
- Asset Validation: Validate the existence and structure of asset files during development and build
- Flexible Configuration: Configure using inline schema definitions or schema file paths
- Build Process Integration: Seamlessly integrated with the Nuxt build process
- Public Asset Configuration: Automatically configure specific subdirectories as public assets
Installation
# npm
npm install --save-dev @schemasset/nuxt
# yarn
yarn add -D @schemasset/nuxt
# pnpm
pnpm add -D @schemasset/nuxtUsage
Add the module to your nuxt.config.ts file and configure as needed:
export default defineNuxtConfig({
modules: ["@schemasset/nuxt"],
schemasset: {
// Schema definition (inline)
schema: {
targetDir: "public-dyn",
files: [
{ pattern: "**/favicon.ico" },
{ pattern: "**/logo.png" },
{ pattern: "**/og-image.png", optional: true }
]
},
// Or use a schema file path
// schemaPath: './schemasset.json',
// Whether to check during build (default: true)
checkOnBuild: true,
// Whether to fail on error (default: true)
failOnError: true,
// Whether to show detailed logs (default: false)
verbose: false,
// Build settings
build: {
// Subdirectory to publish
subdir: "domain-a",
// Output directory (default: 'assets')
outDir: "public"
}
}
});Configuration Options
| Option | Type | Default | Description |
|---|---|---|---|
schema | Object | undefined | Inline schema definition |
schemaPath | String | undefined | Path to schema file |
checkOnBuild | Boolean | true | Whether to validate assets during build |
failOnError | Boolean | true | Whether to fail the build on error |
verbose | Boolean | false | Whether to show detailed logs during validation and build |
build.subdir | String | undefined | Subdirectory of assets to publish |
build.outDir | String | 'assets' | Output directory for public assets |
How It Works
- Validation Process: Asset validation is executed before build (
build:before) and before Nitro build (nitro:build:before) - Development Mode: In development mode, the module serves assets from your configured subdirectory using a virtual server middleware
- Production Mode: In production, assets are configured as public assets in Nitro
- Public Directory Support: If assets are located within Nuxt's public directory, paths are automatically adjusted
When a build.subdir is specified, the module will:
- In production: Configure those assets to be available under the specified
build.outDirURL path - In development: Set up a virtual server middleware that handles 404s and serves assets from that directory under the same URL structure
Examples
Domain-Specific Asset Management
Example configuration for managing assets for multiple domains:
// nuxt.config.ts
export default defineNuxtConfig({
modules: ["@schemasset/nuxt"],
schemasset: {
schema: {
targetDir: "public-dyn",
files: [
{ pattern: "**/favicon.ico" },
{ pattern: "**/logo.png" }
]
},
build: {
// Can be dynamically set based on environment variables or runtime config
subdir: process.env.DOMAIN || "domain-a",
outDir: "public"
}
}
});License
MIT