模板节点本地库导入

By simon at 2018-02-07 • 0人收藏 • 41人看过

我必须设置一个,大部分时间,离线安装Node-RED并需要 在模板节点中使用“Chart.js”库。目前我的工作 方法是将Chart.js目录复制到node-red-dashboard / dist / js和 用<script src= "js/chart.js/dist/Chart.min.js"></script>导入当我想更新我需要的仪表板 再次复制一切。所以有一个永久的解决方案将是很好的 这个。 直到现在我还尝试了另外两种方法。对于我安装Chart.js的 .node红色胜利。首先,我尝试这样做:

var canvas = document.getElementById('myChart').getContext('2d');
var ChartJs = require('Chart.js');
var chart = new ChartJs(canvas, {... }
在脚本标记中(...代表未编辑的工作图表代码), 但是并没有工作和functionGlobalContext: {chartjs:require('Chart.js')}进入settings.js并更改 require('Chart.js')至global.get('chartjs') 有没有人有一个想法来解决这个问题? Unfortun节点 抛出没有错误的控制台,所以我不明白什么是错的。 提前感谢每一个提示或解决方案离子, 成千上万的地方

2 个回复 | 最后更新于 2018-02-07
2018-02-07   #1

当我想在我的节点红色仪表板中使用任何第三方图表库时, 将2个ui_template节点放入我的流程中:   下“模板类型”选择“添加到网站<head>”部分,并添加链接到图书馆的网址:

<script src="url/to/library.js"></script>
(在y我们的离线案例将是一个本地的网址)   2.直接在模板中使用库的导出对象,而不使用require,如:
<div id="myChart"></div>

<script>
    var canvas = document.getElementById('myChart').getContext('2d');
    var chart = new ChartJs(canvas, { ... }
</script>
诀窍是让您的本地节点红色实例服务于ChartJS库 通过本地的网址。为此,首先添加这个需要路径行到 * settings.js *文件,在导出部分之前:
// The `https` setting requires the `fs` module. Uncomment the following
// to make it available:
var fs = require("fs");
var path = require ("path");
那么,unc省略下面的httpStatic部分,在出口内:
// When httpAdminRoot is used to move the UI to a different root path, the
// following property can be used to identify a directory of static content
// that should be served at http://localhost:1880/.
httpStatic: path.join(__dirname, 'public'),
(您可以使用任何目录名称,而不是public) __dirname通常引用节点 - 红色服务器的工作目录 .node-red在您的主目录下。创建这个新的public目录,将ChartJS文件复制到它下面 重新启动节点红色。在启动时,你应该看到一行控制台日志显示 新的静态文件位置的路径:
5 Feb 12:12:23 - [info] Settings file  : C:\NODE\node_red_ui\settings.js
5 Feb 12:12:23 - [info] HTTP Static    : C:\NODE\node_red_ui\public
5 Feb 12:12:23 - [info] User directory : C:\NODE\node_red_ui
现在你可以服务本地文件public\scripts\abc.js了唱当地的网址 http://localhost:1880/scripts/abc.js这样,仪表板代码的npm更新不会被覆盖 你的静态文件。

2018-02-07   #2

当我想在我的节点红色仪表板中使用任何第三方图表库时, 将2个ui_template节点放入我的流程中:   下“模板类型”选择“添加到网站<head>”部分,并添加链接到图书馆的网址:

<script src="url/to/library.js"></script>
(在y我们的离线案例将是一个本地的网址)   2.直接在模板中使用库的导出对象,而不使用require,如:
<div id="myChart"></div>

<script>
    var canvas = document.getElementById('myChart').getContext('2d');
    var chart = new ChartJs(canvas, { ... }
</script>
诀窍是让您的本地节点红色实例服务于ChartJS库 通过本地的网址。为此,首先添加这个需要路径行到 * settings.js *文件,在导出部分之前:
// The `https` setting requires the `fs` module. Uncomment the following
// to make it available:
var fs = require("fs");
var path = require ("path");
那么,unc省略下面的httpStatic部分,在出口内:
// When httpAdminRoot is used to move the UI to a different root path, the
// following property can be used to identify a directory of static content
// that should be served at http://localhost:1880/.
httpStatic: path.join(__dirname, 'public'),
(您可以使用任何目录名称,而不是public) __dirname通常引用节点 - 红色服务器的工作目录 .node-red在您的主目录下。创建这个新的public目录,将ChartJS文件复制到它下面 重新启动节点红色。在启动时,你应该看到一行控制台日志显示 新的静态文件位置的路径:
5 Feb 12:12:23 - [info] Settings file  : C:\NODE\node_red_ui\settings.js
5 Feb 12:12:23 - [info] HTTP Static    : C:\NODE\node_red_ui\public
5 Feb 12:12:23 - [info] User directory : C:\NODE\node_red_ui
现在你可以服务本地文件public\scripts\abc.js了唱当地的网址 http://localhost:1880/scripts/abc.js这样,仪表板代码的npm更新不会被覆盖 你的静态文件。

登录后方可回帖

Loading...