Node-RED自定义节点：如何在oneditprepare中引入外部JS函数

我明白你的痛点——把前端编辑器里用的函数（比如oneditprepare里调用的）独立成文件，既方便维护又能复用，但之前的方法都踩坑了对吧？别慌，给你两个靠谱的解决方案：

方案一：通过Node-RED配置全局加载前端脚本 #

这是官方推荐的方式，能让你的自定义脚本被Node-RED编辑器自动加载到前端：

1. 打开Node-RED的settings.js配置文件（通常在用户目录下的.node-red文件夹里）
2. 找到editorTheme配置项，如果没有就自己加一个，然后在里面添加scripts数组，指向你的脚本文件路径：

   editorTheme: {
       scripts: [
           // 可以用绝对路径，比如
           "/home/your-user/.node-red/scripts/my-frontend-functions.js",
           // 或者相对Node-RED用户目录的路径
           "./scripts/my-frontend-functions.js"
       ]
   }
   

3. 把你的函数代码放到指定的脚本文件里，注意要把函数暴露到全局作用域，比如挂到window对象上：

   // my-frontend-functions.js
   window.myReusableEditFunction = function() {
       // 你的大段函数代码
       console.log("执行复用的前端函数");
   };
   

4. 重启Node-RED，之后在你的节点oneditprepare里就能直接调用myReusableEditFunction()了。

方案二：在自定义节点的HTML文件中引入脚本 #

如果这个函数只在特定自定义节点里复用，更推荐这种方式，把脚本和节点绑定在一起：

1. 整理你的自定义节点目录结构，比如：

   my-custom-node/
   ├── my-custom-node.html  # 节点的前端定义文件
   ├── my-custom-node.js    # 节点的后端逻辑文件
   └── frontend-lib/
       └── edit-functions.js  # 你的复用函数文件
   

2. 在my-custom-node.html里，用<script>标签引入你的复用脚本，路径是相对于节点目录的：

   <script type="text/javascript" src="./frontend-lib/edit-functions.js"></script>
   

3. 同样在edit-functions.js里把函数暴露到全局，然后在节点的oneditprepare里直接调用即可。

为什么之前的方法不行？ #

• 直接在节点定义脚本上方加<script>标签：Node-RED的编辑器只会处理节点HTML文件中正确声明的资源，这种随意添加的脚本不会被发送到前端。
• 用functionGlobalContext引入：这个配置是给后端（运行时）用的，前端编辑器完全访问不到这里的变量，自然没法调用。

内容的提问来源于stack exchange，提问作者Kevin Chacón