webpack - 如何捆绑下载的库

Question

我已经下载了一个 javascript + css + 图像库 ( dxhtml )，并希望将其捆绑在一起，而不是在 html 中对脚本/css 导入进行硬编码。但 javascript 不是模块(它不执行 module.exports 操作)。

实现这一目标的最佳方法是什么？我应该将库中的主文件添加到 webpack.config.js 中的 entry 吗？

我成功捆绑了各种节点模块，但我尝试包含本地文件但没有成功。

Answer 1

我通过使用 css-loader 和 Exports-loader 配置 webpack 来实现此功能。

CSS 加载器

遵循 webpack 的官方 CSS 加载器步骤: https://github.com/webpack/css-loader

JavaScript 导出加载器

为了加载JavaScript，请使用exports-loader 指定要从DHTMLX 文件导出哪些函数。首先，安装exports-loader:

npm install --save-dev exports-loader

接下来，指定要从 dhtmlx 导出的函数:

require('./dhtmlx/tree/codebase/dhtmlxtree.css');

var dhx = require('exports?' +
    'treeObject=dhtmlXTreeObject' +
    '!./dhtmlx/tree/codebase/dhtmlxtree.js');

var myTree = new dhx.treeObject('treeboxbox_tree', '100%', '100%', 0);