# Predefined web root

**URL:** <https://discourse.nodered.org/t/predefined-web-root/96654>\
**Category:** Developing Nodes\
**Tags:** node-red-dashboard, dashboard-2\
**Created:** [20 April 2025 10:58 UTC](https://discourse.nodered.org/t/predefined-web-root/96654 "2025-04-20T10:58:33Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![omrid](https://avatars.discourse-cdn.com/v4/letter/o/77aa72/32.png) [@omrid](https://discourse.nodered.org/u/omrid)\
**Post date:** [20 April 2025 10:58 UTC](https://discourse.nodered.org/t/predefined-web-root/96654/1 "2025-04-20T10:58:33Z")

</div>

I have developed a dashboard-2 UI node, which sometimes needs to fetch external web resources such as CSS stylesheets or icons, located on the server.

The UI widgets need to have web access to these resources. I know I can configure an `httpStatic` root in **settings.js** , but looking for an "out-of-the-box" web root, without forcing additional system-level configuration.

There is a default dashboard web-root (`<Node-red user dir>\node_modules\@flowfuse\node-red-dashboard\dist`), but (as per web security) it will only allow me to point to "upward" locations (subfolders) which get erased upon every dashboard upgrade.

Currently I am solving this by fetching the resources during initialization of the server node and piggybacking them on the config object (sent to the widgets upon widget initialization). But this is cumbersome and not flexible.

Is there a better way?

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [20 April 2025 11:15 UTC](https://discourse.nodered.org/t/predefined-web-root/96654/2 "2025-04-20T11:15:16Z")

</div>

Hi @omrid  
I don't develop anything for the DB.

But all user contributed Nodes, have access to the `resources` API.

In the root of your Node, create a folder called `resources`  
anything here can then be fetched via standard HTTP calls.

- My Node Root
  - package.json
  - **resources**
    - styles.css
    - logo.png

You then call into these resources like so.

```auto
<img src="resources/<Your Package Name>/logo.png">

```

This is the correct way to provide resources for nodes,  
but I don't know if this differs for DB, so I could be wrong

See : [Loading extra resources in the editor : Node-RED](https://nodered.org/docs/creating-nodes/resources)

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [20 April 2025 11:53 UTC](https://discourse.nodered.org/t/predefined-web-root/96654/3 "2025-04-20T11:53:24Z")

</div>

As always, if you are pushing to the edges of one of the Dashboard implementations, you might find it easier in the long-run to use uibuilder which does not make assumptions or constrain you.

---

<div class="post-metadata">

**Author:** ![omrid](https://avatars.discourse-cdn.com/v4/letter/o/77aa72/32.png) [@omrid](https://discourse.nodered.org/u/omrid)\
**Post date:** [20 April 2025 12:39 UTC](https://discourse.nodered.org/t/predefined-web-root/96654/4 "2025-04-20T12:39:27Z")

</div>

> [@marcus-j-davies](#):
>
> In the root of your Node, create a folder called `resources`  
> anything here can then be fetched via standard HTTP calls.

Thank you!  
This solves the problem!

---

<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:** [4 May 2025 12:40 UTC](https://discourse.nodered.org/t/predefined-web-root/96654/5 "2025-05-04T12:40:10Z")

</div>

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