Question

我在Symfony4上使用slickgrid

Symfony4使用webpack系统。

所以我的源代码是这样的，

但显示错误

Slick.Grid is not a constructor

通常，此错误表示它不会加载变量，但是我无法弄清楚哪里出了错。

在app.js中

var $ = require('jquery');
require('bootstrap');
require('slickgrid');

console.log(Slick); // it shows in console `{Event: ƒ, EventData: ƒ, EventHandler: ƒ, Range: ƒ, NonDataRow: ƒ, …}`


$(document).ready(function() {

    var grid;
    var columns = [
      {id: "title", name: "Title", field: "title"},
      {id: "duration", name: "Duration", field: "duration"},
      {id: "%", name: "% Complete", field: "percentComplete"},
      {id: "start", name: "Start", field: "start"},
      {id: "finish", name: "Finish", field: "finish"},
      {id: "effort-driven", name: "Effort Driven", field: "effortDriven"}
    ];

    var options = {
      enableCellNavigation: true,
      enableColumnReorder: false
    };

      var data = [];
      for (var i = 0; i < 500; i++) {
        data[i] = {
          title: "Task " + i,
          duration: "5 days",
          percentComplete: Math.round(Math.random() * 100),
          start: "01/01/2009",
          finish: "01/05/2009",
          effortDriven: (i % 5 == 0)
        };
      }
      grid = new Slick.Grid("#myGrid", data, columns, options);

});

Answer 1

Slickgrid是一个编写不良的库，其行为很差，例如依赖于全局变量，依赖于window对象，并且仅通过加载该库就具有副作用。

选项1

要在现代项目中使用像这样危险设计的库，您需要使用它们的现代派生。请改用slickgrid-es6。

选项2

如果要在npm中继续使用非现代版本，则看起来您需要这样做：

require('slickgrid/slick.core.js')
require('slickgrid/slick.grid.js')

然后，您将可以访问全局Slick和Slick.Core。不建议这样做，因为该库遵循不良做法，尽管已发布到npm，但未遵循任何npm标准。尤其令人恐惧的是，npm包中根本没有记录。到目前为止，该更新与此问题无关。

选项3

或者，如果您不想使用构建工具，则可以简单地包括SlickGrid脚本标记并使用全局变量Slick和Slick.Grid。

Slick.Grid不是构造函数

1 个答案: