Question

我想在我的流星项目中使用jsPlumb。当我查看网络时，我看到你可以用meteor add jsplumb:jsplumb命令包含它。但是，我用mrt --release 0.6.5.1标志运行我的meteor项目。因此，我想我无法使用它。有没有办法将jsPlumb添加到我的项目中？

修改

根据建议，我将JsPlumb-1.7.10.js置于客户端/兼容性之下。然后我创建了一个名为flowchart.js的文件，其内容为：

jsPlumb.ready(function() {
  jsPlumb.setContainer($('#container'));

  var i = 0;
  $('#container').dblclick(function(e) {
    var newState = $('<div>').attr('id', 'state' + i).addClass('item');

    var title = $('<div>').addClass('title').text('State ' + i);
    var connect = $('<div>').addClass('connect');

    newState.css({
      'top': e.pageY,
      'left': e.pageX
    });

    newState.append(title);
    newState.append(connect);

    $('#container').append(newState);

    jsPlumb.makeTarget(newState, {
      anchor: 'Continuous'
    });

    jsPlumb.makeSource(connect, {
      parent: newState,
      anchor: 'Continuous'
    });

    jsPlumb.draggable(newState, {
      containment: 'parent'
    });
    newState.dblclick(function(e) {
      jsPlumb.detachAllConnections($(this));
      $(this).remove();
      e.stopPropagation();
    });

    i++;
  });
});

和我的flowchart.html文件是：

<template name="flowchart">
<style type="text/css">
      .item {
        position: absolute;
        border: 1px solid black;
        background-color: #ddddff;
      }
      #container {
        border: 1px solid gray;
        width: 500px;
        height: 500px;
      }

    .title {
      padding: 10px;
      cursor: move;
    }

    .connect {
      width: 100%;
      height: 20px;
      background-color: white;
      cursor: pointer;
    }
    </style>
    <div id="container"></div>
</template>

但是当我去http://localhost:3000/flowchart时，我收到以下错误：

Uncaught ReferenceError flowchart.js: jsPlumb is not defined

可能导致此问题的原因是什么？

顺便说一下，这是我发现here

的例子

Answer 1

您可能不需要使用jsplumb meteor包来添加它。获取jsPlumb-1.7.10.js文件并将其粘贴到名为client/compatibility的文件夹中。

更好的解决方案是更新Meteor。这是可行的。

如何在流星项目中使用JSplumb（流星项目版本0.6.5.1）

1 个答案: