Skip to content
Julian Knight edited this page Apr 28, 2019 · 5 revisions

uibuilder v2 brings a number of breaking changes from v1. This page shows the new URI paths that you need to include in your front-end HTML files.

  • <httpNodeRoot>/<instanceName>/ is mapped to several folders (shown in priority order):

    • <uibRoot>/<instanceName>/dest/ (only if index.html exists there)
    • <uibRoot>/<instanceName>/src/
    • <userDir>/node_modules/node-red-contrib-uibuilder/nodes/dest/ (only if index.html exists there)
    • <userDir>/node_modules/node-red-contrib-uibuilder/nodes/src/

    Examples:

    • <link rel="icon" href="./images/node-blue.ico">
    • <link rel="manifest" href="./manifest.json">
    • <link rel="stylesheet" href="./index.css" media="all">
    • <script src="./uibuilderfe.min.js"></script>
    • <script src="./index.js"></script>
  • <httpNodeRoot>/<moduleName>/vendor/<packageName>/ is mapped to the <userDir>/node_modules/<packageName> folder which is where npm will install things when installing to the userDir folder.

    Examples:

    • <link type="text/css" rel="stylesheet" href="../uibuilder/vendor/bootstrap/dist/css/bootstrap.min.css" />
    • <script src="../uibuilder/vendor/vue/dist/vue.js"></script>
  • ../uibuilder/vendor/socket.io/socket.io.js provides the Socket.io client library.

  • <httpNodeRoot>/<moduleName>/common/ is mapped to <uibRoot>/common - used to serve up resources you want available to all instances of uibuilder.

    Example <img src="../uibuilder/common/myimage.png">

Variables

  • <uibRoot> = <httpNodeRoot>/<moduleName> or <userDir>/projects/<activeProject>/<moduleName> if Node-RED projects are in use. <moduleName> = 'uibuilder'
  • <userDir> = ~/.node-red normally.
  • <packageName> = Name of an npm package installed via npm install <packageName>.
  • <instanceName> = Name (url) assigned to an instance node of uibuilder in a flow.
Clone this wiki locally