# Packaged subflows show up as sf:undefined in the pallette

**URL:** <https://discourse.nodered.org/t/packaged-subflows-show-up-as-sf-undefined-in-the-pallette/67375>\
**Category:** Developing Nodes\
**Created:** [6 September 2022 06:59 UTC](https://discourse.nodered.org/t/packaged-subflows-show-up-as-sf-undefined-in-the-pallette/67375 "2022-09-06T06:59:53Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![sg26565](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/sg26565/32/67419_2.png) [@sg26565](https://discourse.nodered.org/u/sg26565)\
**Post date:** [6 September 2022 06:59 UTC](https://discourse.nodered.org/t/packaged-subflows-show-up-as-sf-undefined-in-the-pallette/67375/1 "2022-09-06T06:59:53Z")

</div>

I have some subflows that I want to share with other projects and therefore, I tried to package them as a module. I followed the documentation about subflow modules in the "Creating Nodes" guide. I was able to package one of my subflows and install the module. The subflow also works as expected. However, it shows up as "sf:undefined" in the palette with a default color and icon. Node-RED seems to ignore the settings in the subflow json. How can I give it a proper name, color, icon and category? How can I package more than one subflow in the same module?

For testing, I've created a trivial subflow that simply sets the payload to "foo".

foo.json

```auto
[
    {
        "id": "f0880b6cfc44474e",
        "type": "subflow",
        "name": "foo",
        "info": "",
        "category": "",
        "in": [
            {
                "x": 40,
                "y": 80,
                "wires": [
                    {
                        "id": "b2442e2050f229ce"
                    }
                ]
            }
        ],
        "out": [
            {
                "x": 360,
                "y": 80,
                "wires": [
                    {
                        "id": "b2442e2050f229ce",
                        "port": 0
                    }
                ]
            }
        ],
        "env": [],
        "meta": {
            "module": "foo",
            "type": "foo",
            "version": "0.0.1",
            "author": "Oliver Treichel <oliver.treichel@bayer.com>",
            "desc": "Description",
            "keywords": "foo"
        },
        "color": "#DDAA99"
    },
    {
        "id": "b2442e2050f229ce",
        "type": "change",
        "z": "f0880b6cfc44474e",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "payload",
                "pt": "msg",
                "to": "foo",
                "tot": "str"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 200,
        "y": 80,
        "wires": [
            []
        ]
    }
]

```

This subflow gets registered via flow.js

```auto
const fs = require("fs");
const path = require("path");

module.exports = function(RED) {
    const subflowFile = path.join(__dirname,"foo.json");
    const subflowContents = fs.readFileSync(subflowFile);
    const subflowJSON = JSON.parse(subflowContents);
    RED.nodes.registerSubflow(subflowJSON);
}

```

The module package.json looks like this:

```auto
{
  "name": "foo",
  "version": "0.0.1",
  "description": "Test",
  "keywords": [
    "foo"
  ],
  "author": "Oliver Treichel <oliver.treichel@gmx.de>",
  "license": "UNLICENSED",
  "node-red": {
    "nodes": {
      "foo": "foo.js"
    }
  }
}

```

I've also created a foo.html as for "normal" modules, but this didn't work either.

```auto
<script type="text/javascript">
    RED.nodes.registerType('foo',{
        category: 'misc',
        color: '#a6bbcf',
        defaults: {
            name: {value:""}
        },
        inputs:1,
        outputs:1,
        icon: "file.png",
        label: function() {
            return this.name||"foo";
        }
    });
</script>

<script type="text/html" data-template-name="foo">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
</script>

<script type="text/html" data-help-name="foo">
    <p>A simple node that adds foo to the message</p>
</script>

```

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [5 November 2022 07:00 UTC](https://discourse.nodered.org/t/packaged-subflows-show-up-as-sf-undefined-in-the-pallette/67375/2 "2022-11-05T07:00:33Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
