Types

Rules

LazyLoadRule

  • All supported rules
export type LazyLoadRule = "windowWidthGreaterThan" | "windowWidthLessThan";

LazyLoadRuleScreenSize

  • Configuration for rules related to screen width
export type LazyLoadRuleScreenSize = { width: number };

LazyLoadRuleConfigMap

  • Rule to RuleConfig mapping
interface LazyLoadRuleConfigMap {
  windowWidthGreaterThan: LazyLoadRuleScreenSize;
  windowWidthLessThan: LazyLoadRuleScreenSize;
}

LazyLoadRuleConfiguration

export type LazyLoadRuleConfiguration = {
  [key in LazyLoadRule]?: LazyLoadRuleConfigMap[key];
}

Module

ModuleOptions

  • ModuleOptions ensures that files are correctly typed based on the rule and includes the LazyLoadRuleConfiguration
export interface ModuleOptions extends LazyLoadRuleConfiguration {
  /**
   * What directory in your end build ("dist" by default) do you want the files to be in ?
   * This is the base directory, will be used so the plugin knows where the files that
   * need to be loaded are
   * @default "assets/css"
   */
  outputDir?: string;
  /**
   * Path to a directory to process all of the files in it. Works recursively
   * @default undefined
   */
  inputDir?: string;
  /**
   * Configuration of specific files you want to lazy load
   * @default undefined
   */
  files?: LazyFileConfiguration;
  /**
   * Whether or not you want the plugin enabled
   * @default true
   */
  plugin?: boolean;
  /**
   * Sets the log level from the module to verbose instead of the default, which is warn
   * @default undefined
   */
  verbose?: boolean;
}

LazyFileConfiguration

  • ModuleOptions.files prop configuration
export interface LazyFileConfiguration {
  /**
   * Configuration for styling files to process
   * @default undefined
   */
  css: LazyFile
}

LazyFile

  • LazyFileConfiguration prop configuration
export interface LazyFile extends LazyLoadRuleConfiguration {
  /**
   * filepath (with name) of the specific file you want to load. This is relative to nuxt.options.rootDir
   * @required
   */
  filePath: string;
  /**
   * If you want the resulting file to have a different name than the input file. This is relative to nuxt.options.rootDir
   * @default undefined
   */
  outputFilename?: string;
}

LazyLoadProcessedFiles

  • Processing result. This is what the plugin will uses
export interface LazyFile extends LazyLoadRuleConfiguration {
 /**
   * Path + filename that lead to the file that was processed and is now in the dir specified
   * by outputDir
   * @see ModuleOptions
   * @default "assets/css"
   */
  path: string;
  /**
   * What rules are being applied to the file the path points to
   */
  rules: LazyLoadRuleConfiguration;
}