WARNING: Probably a lot of stuff you already know so my apologies for teaching you to suck eggs.
So, forgetting ESM or Deno for a moment, using your viewer in a run of the mill project would typically be imported via npm e.g. const gregsViewer = required('name-of-your-package') so publishing to NPM is a great way to get this out there.
Similarly, using this actually in node-red, a user can import (require) your module by entering it in the setup tab of a function node. This would enable a user to import this & use it on (for example) a dashboard, uibuilder, pdfMake, a straight endpoint, or wherever!
Something like
// const const gregsViewer = required('name-of-your-package') // imported via setup tab
msg.payload = gregsViewer.flowToSVG(msg.payload)
return msg; // return the SVG generated by gregsViewer
The tricky part - naming.
As it is not a Node-RED node package or plugin (YET 
) naming can really be whatever you wish however you might want to scope it to your NPM username. e.g. @gornje/flow2svg or @gornje/nr-flow-utils or anything really.
The easy part - packaging.
To publish your module to NPM, you will need to package up the node.
- Create a new directory e.g.
flow2svg
cd to the directory- initialise it as a package - enter
npm init & answer the questions...
$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help init` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
package name: (flow2svg) @gorenje/flow2svg
version: (1.0.0) 0.0.1-beta.1
description: A stand-alone utility package for visualising Node-RED flows
entry point: (index.js) flowviewer.js
test command:
git repository:
keywords: node-red,flow,viewer
author: gorenje
license: (ISC) Apache-2.0
About to write to \flow2svg\package.json:
{
"name": "@gorenje/flow2svg",
"version": "0.0.1-beta.1",
"description": "A stand-alone utility package for visualising Node-RED flows",
"main": "flowviewer.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"node-red",
"flow",
"viewer"
],
"author": "gorenje",
"license": "Apache-2.0"
}
Is this OK? (yes)
- open the directory it in your fav editor (vscode?), drop the necessary files in
- update the
package.json file - add other fields e.g.
-
"repository": { "type": "git", "url": "https://github.com/..." }
-
"bugs": { "url": "https://github.com/.../issues" }
-
"engines": { "node": ">=14.x" }
-
"files": [ "README.md", "LICENSE", "file1.js", "file2.html" ]
- Publish as alpha/beta
- try it in a node-red function node / ask others to try it out
- titivate
- bump version number to something better (e.g.
1.0.0) and publish it for real
TIP: Do not include copies of JQuery or any other external packages in your package - this leads to duplication, larger packages, collisions and other nasty issues. Instead, you would include them as dependencies or peer dependencies in your package.json
Version Numbers. Node and NPM generally use sematic versioning. Early releases are often 0.0.1 or 0.1.0 or even 1.0.0-alpha.1 - you decide, but users expect the patch/minor/major version number changes to reflect compatibility or incompatibility.
Happy to help you out if you wish - I'm around for the next hour or 2.
Please provide feedback and suggestions, this is just a proof of concept implementation!
