Introduction

neon-create is a utility to generate Vue components from SVG files and create an index of these components. This package provides both CLI and API interfaces for integration and usage.

Installation

To add neon-create to your project, run the following command:

npm install @parcz/neon-create --save-dev

Usage

There are two primary ways to use neon-generator: via the command line interface (CLI) or programmatically in your JavaScript/TypeScript code.

CLI Usage

Setup NPM Scripts

Add the following scripts to the scripts section of your package.json:

"scripts": {
    "create-entry": "create-entry-index --input=./path-to-source --output=./path-to-output",
    "create-svg-vue": "create-svg-vue --input=./path-to-source --output=./path-to-output",
    "create-all": "npm run create-entry && npm run create-svg-vue"
}

Ensure you replace ./path-to-source and ./path-to-output with the appropriate paths for your project.

Run the Scripts

You can now use the following commands to run the generators:

To generate the Vue components index:

• npm run create-entry

To generate Vue components from SVG files:

• npm run create-svg-vue

To run both operations consecutively:

• npm run create-all

API Usage Import the Required Functions

In your JavaScript/TypeScript file:

import { createSvgVue, createVueComponentsIndex } from '@parcz/neon-create';

Use the Functions in Your Code

// To create Vue components from SVGs
createSvgVue(inputPath, outputPath);

// To create an index of Vue components
createVueComponentsIndex(inputPath, outputPath);

Conclusion neon-create provides a streamlined way to manage SVGs as Vue components in your project. Whether you're using the command line or integrating directly into your codebase, neon-generator offers flexibility and efficiency.