npm package: @jeroendruwe/vite-aem-clientlib-generator
Description: Creates a AEM clientlib based on the manifest.json generated by Vite
Author: Jeroen Druwé
Latest version: 0.0.1

vite-aem-clientlib-generator
============================

Creates a AEM clientlib based on the manifest.json generated by Vite

[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
[![Version](https://img.shields.io/npm/v/@jeroendruwe/vite-aem-clientlib-generator.svg)](https://www.npmjs.com/package/@jeroendruwe/vite-aem-clientlib-generator)
[![Downloads/week](https://img.shields.io/npm/dw/@jeroendruwe/vite-aem-clientlib-generator.svg)](https://www.npmjs.com/package/@jeroendruwe/vite-aem-clientlib-generator)
[![License](https://img.shields.io/npm/l/@jeroendruwe/vite-aem-clientlib-generator.svg)](https://github.com/Jdruwe/vite-aem-clientlib-generator/blob/master/package.json)

<!-- toc -->
* [Usage](#usage)
* [Commands](#commands)
* [Configuration](#configuration)
<!-- tocstop -->

# Usage

<!-- usage -->
```sh-session
$ npm install -g @jeroendruwe/vite-aem-clientlib-generator
$ vite-aem-lib COMMAND
running command...
$ vite-aem-lib (-v|--version|version)
@jeroendruwe/vite-aem-clientlib-generator/0.0.0 darwin-x64 node-v14.18.1
$ vite-aem-lib --help [COMMAND]
USAGE
  $ vite-aem-lib COMMAND
...
```
<!-- usagestop -->

# Commands

<!-- commands -->
* [`vite-aem-lib generate`](#vite-aem-lib-generate)
* [`vite-aem-lib help [COMMAND]`](#vite-aem-lib-help-command)

## `vite-aem-lib generate`

Generate the AEM clientlib

```
USAGE
  $ vite-aem-lib generate
```

_See code: [src/commands/generate.ts](https://github.com/Jdruwe/vite-aem-clientlib-generator/blob/v0.0.0/src/commands/generate.ts)_

## `vite-aem-lib help [COMMAND]`

display help for vite-aem-lib

```
USAGE
  $ vite-aem-lib help [COMMAND]

ARGUMENTS
  COMMAND  command to show help for

OPTIONS
  --all  see all commands in CLI
```

_See code: [@oclif/plugin-help](https://github.com/oclif/plugin-help/blob/v3.2.3/src/commands/help.ts)_
<!-- commandsstop -->

# Configuration

Place a `vite.lib.config.js` configuration file next to where you run the `generate` command.

**Required properties:**

- manifest
  - location of the Vite generated manifest.json file
- resourcesDir
  - location of the Vite generated output
- clientlibDir
  - location of the to be generated clientlib
- categories
  - will be copied over to the clientlib categories property

**Optional properties**

- properties
  - list of properties that will be directly added to the clientlib

**Simple example**

```
module.exports = {
  libs: [
    {
      manifest: 'dist/manifest.json',
      resourcesDir: 'dist/etc.clientlibs/project/clientlibs/demo-clientlib/resources',
      clientlibDir: '../ui.apps/src/main/content/jcr_root/apps/project/clientlibs/demo-clientlib',
      categories: ['demo-category'],
      properties: {
        moduleIdentifier: 'vite',
      },
    },
  ],
}
```

**Multiple example**

Once you start using Vite for multiple clientlibs, it makes sense to create some helper functions:

```
const buildManifest = (name) => {
  return path.join(__dirname, 'dist', name, 'manifest.json');
};

const buildResourcesDir = (name) => {
  return path.join(
    __dirname,
    'dist',
    name,
    'etc.clientlibs',
    'aem-vite-demo',
    'clientlibs',
    name,
    'resources'
  );
};

const buildClientlibDir = (name) => {
  return path.join(
    __dirname,
    '..',
    'ui.apps',
    'src',
    'main',
    'content',
    'jcr_root',
    'apps',
    'aem-vite-demo',
    'clientlibs',
    name
  );
};

const createLib = (name, categories) => {
  return {
    manifest: buildManifest(name),
    resourcesDir: buildResourcesDir(name),
    clientlibDir: buildClientlibDir(name),
    categories: [...categories],
    properties: {
      moduleIdentifier: 'vite',
    },
  };
};

module.exports = {
  libs: [
    createLib('clientlib-esmodule', ['aem-vite-demo.esmodule']),
    createLib('clientlib-esmodule-another', ['aem-vite-demo.esmodule.another']),
  ],
};
```