> ## Documentation Index
> Fetch the complete documentation index at: https://doc.lucidworks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# JS-based stages in pipelines

export const LwTemplate = ({title = "Key questions to get you started", icon = "sparkles", cta = "Powered by Agent Studio", linkHref = "https://lucidworks.com/demo/?utm_source=docs&utm_medium=referral&utm_campaign=docs_cta_ai"}) => {
  const [isLoaded, setIsLoaded] = useState(false);
  useEffect(() => {
    const timer = setTimeout(() => {
      setIsLoaded(true);
    }, 500);
    return () => clearTimeout(timer);
  }, []);
  return <div className="lw-template-container">
      <Card title={title} icon={icon}>
        {isLoaded && <span dangerouslySetInnerHTML={{
    __html: `<lw-template id="a029c1a9-28be-427e-b0e1-5d918920246a"></lw-template
            >`
  }} />}
        <Link href={linkHref} className="agent-studio-link text-left text-gray-600 gap-2 dark:text-gray-400 text-sm font-medium flex flex-row items-center hover:text-primary dark:hover:text-primary-light group-hover:text-primary group-hover:dark:text-primary-light">Powered by Lucidworks Agent Studio</Link>
      </Card>
    </div>;
};

[old doc.lw link]: https//doc.lucidworks.com/fusion/5.9/jjg5pb

[localhost link]: http://localhost:3000/docs/5/fusion/operations/config-sync/objects/js-pipeline-stages

[mintlify link]: https://doc.lucidworks.com/docs/5/fusion/operations/config-sync/objects/js-pipeline-stages

When working with Fusion’s pipelines, you might come across stages that use JavaScript (JS) for custom logic.
These are known as JS-based stages and are identified by their type, which includes either `javascript-query` or `javascript-index`.
To make life easier when dealing with these stages, ConfigSync adopts a smart approach.

<LwTemplate />

## Storing JS scripts separately

Instead of embedding JS scripts directly within the pipeline configuration, ConfigSync saves the script content to separate files.
This setup not only makes it easier to view and edit the scripts but also keeps your pipeline configurations clean and manageable.

## Where JS files are stored

* All JS files related to pipelines are stored in a `/js` folder within the specific pipeline folder.\
  For index pipelines, this would be `/index-pipelines/js`, and for query pipelines, `/query-pipelines/js`.
* Within the `/js` folder, there’s a subfolder named after the pipeline to which the scripts belong.\
  This helps keep everything organized and easy to find.
* The name of the JS file can vary and is typically based on the stage label used within ConfigSync.\
  However, it’s crucial that these files are correctly linked to their corresponding pipeline stages.

## Linking JS files to pipeline stages

This linking is achieved through a meta-file, which maps each stage ID to its JS filename.
Here’s how it works:

* If your pipeline configuration is stored at `app/index-pipelines/pipeline.json`,
* Then your meta-file is located at `app/.metadata/index-pipelines/pipeline.json`.\
  The pattern here is simple: just add `/.metadata` before the pipeline folder in the path.
* This applies to both index and query pipelines.

## The meta-file structure

The meta-file itself is a JSON file that contains mappings from stage IDs to JS filenames.
For example:

```json wrap  theme={"dark"}
{
  "js": {
    "stage-id": "JS-Script-Name.js",
    ...
  }
}
```

Basically, ConfigSync manages this file but in some rare cases such as if you want to rename the JS file you have to also reflect that in the mappings meta-file.

You can make changes in both pipeline-JSON or JS files but if both pipeline-JSON and JS files have been changed JS file changes always win.

This structure ensures that each JS script is correctly associated with its stage in the pipeline, facilitating easy updates and management.

## Managing changes

ConfigSync is designed to handle updates to these mappings, but there might be times when you need to manually adjust them, like if you’re renaming a JS file.
In such cases, remember to update the meta-file to reflect the changes.

When making edits, it’s possible to update both the pipeline configuration (the JSON file) and the JS files.
If there are conflicting changes, the updates made to the JS files take precedence.
This ensures that your custom logic in JS always reflects your latest intentions.