如何在项目中包含html5sortable？

Question

我不确定如何在我的项目中加入html5sortable。我用npm安装了它：

npm install html5sortable --save

在webpack打包之后，我按如下方式导入它：

require 'html5sortable'

但是当我调用（as the docs say）时：

sortable('.sortable');

我明白了：

sortable is not a function或sortable is not defined

我还尝试了以下变体（Livescript）：

html5sortable = require 'html5sortable'
sortable = require 'html5sortable'
{sortable} = require 'html5sortable'

正如文档所说，“从dist /目录中加载文件，例如dist / html.sortable.min.js ”。我正在使用webpack而且我不知道该怎么做，但我已经尝试过了（在webpack.config中（在lifecript中，但它应该足够可读））：

resolve:
    modules:
        'node_modules'
    alias:
        'html5sortable': 'html5sortable/dist/html5sortable.min.js'

不起作用。

Answer 1

原来，webpack只能处理导出模块的javascript文件。在html5sortable的情况下，这是CommonJS包。这就是我必须包含在webpack.config中的内容：

resolve:
    modules:
        'node_modules'
    alias:
        'html5sortable': 'html5sortable/dist/html5sortable.cjs'

之后我可以简单地“要求”图书馆并使用它：

sortable = require 'html5sortable'

sortable '.sortable'