2025-04-19 19:31:46 +02:00

1.5 KiB

Utility Functions

Configuration Utilities

The application includes utility functions for working with the base path configuration. These functions are located in src/utils/config.js.

getBasePath()

Returns the base path from the application configuration.

import { getBasePath } from '../utils/config';

// Example usage
const basePath = getBasePath(); // Returns the base path, e.g., '/app'

getAssetPath(path)

Constructs a complete path for an asset by prepending the base path.

import { getAssetPath } from '../utils/config';

// Example usage
const logoPath = getAssetPath('/images/logo.png');
// If base path is '/app', returns '/app/images/logo.png'

// Works with paths with or without leading slash
const cssPath = getAssetPath('styles/main.css');
// Returns '/app/styles/main.css'

When to Use These Functions

Use these utility functions whenever you need to reference:

  • Static assets (images, CSS, JavaScript)
  • API endpoints
  • Navigation links
  • Any URL that should be relative to the application's base path

Example in a React Component

import React from 'react';
import { getAssetPath } from '../utils/config';

function Header() {
  return (
    <header>
      <img src={getAssetPath('/logo.svg')} alt="Company Logo" />
      <nav>
        <a href={getAssetPath('/')}>Home</a>
        <a href={getAssetPath('/about')}>About</a>
        <a href={getAssetPath('/contact')}>Contact</a>
      </nav>
    </header>
  );
}

export default Header;