@geogirafe/lib-geoportal/buildtools/vite-inline-templates-plugin.js

GeoGirafe is a flexible application to build online geoportals.

// SPDX-License-Identifier: Apache-2.0
import { getCustomStylesAsText, inlineCustomStyles, inlineTemplate } from './tools.js';

const InlineTemplatesPlugin = function (options = {}) {
  let cssOverrides = {};
  return {
    name: 'girafe-inline-templates',
    async configResolved(config) {
      // Get the project root
      const projectRootPath = config.root ?? process.cwd();
      if (options.cssOverrides) {
        cssOverrides = await getCustomStylesAsText(options.cssOverrides, projectRootPath);
      }
    },
    load(id) {
      if ((id.includes('src/components/') || id.includes('src/api/')) && (id.endsWith('.js') || id.endsWith('.ts'))) {
        // Read the file and integrate the HTML and the CSS inline as template string.
        return inlineTemplate(id);
      }
      // The standard load function of vite will be used
      return null;
    },
    transform(code, id) {
      // This part of the plugin is used to inline custom css
      // It will look for occurences of "initializeGeoGirafeCustomStyles();"
      // and replace it with inline style definition
      if (Object.keys(cssOverrides).length > 0 && id.endsWith('.ts')) {
        return inlineCustomStyles(id, cssOverrides, code);
      }
    }
  };
};

export default InlineTemplatesPlugin;