使用 webpack 导入 gojs 扩展

Question

我正在使用 Laravel 8 和 Laravel-mix 以便我的 JS 资产被编译webpack.

我通过这样做成功导入了 gojs:

npm i gojs

然后将此添加到我的 bootstrap.js:

import * as go from 'gojs';

然后编译使用：

npm run dev

到目前为止一切顺利，我的 app.js 现在包括 gojs 代码，我可以在我的页面上运行基本 gojs 示例。

但是我不知道如何包含任何 gojs 扩展。

我已经尝试通过所有这些不同的方式（分别不是一次全部）向我的 boostrap.js 添加扩展：

import DataInspector from 'gojs/extensions/DataInspector.js';
import * as Inspector from 'gojs/extensions/DataInspector.js';
import { DataInspector } from 'gojs/extensionsTS/DataInspector';
require('gojs/extensions/DataInspector.js');
require('../../node_modules/gojs/extensions/DataInspector.js');

大多数编译没有错误，当我检查我的 app.js 已编译 javascript 时，似乎包含了 DataInspector 代码。

但是，当我向使用 Inspect 的页面添加示例脚本时，出现错误：

Uncaught ReferenceError: Inspector is not defined

所以似乎没有包含 DataInspector 扩展。让它工作的唯一方法是直接将脚本标记添加到我的 HTML 中的 DataInspector.js 文件。但是我想弄清楚如何将它与我的所有其他资产一起正确导入。

Answer 1

最好将扩展文件复制到自己的目录下使用。它们作为如何扩展库的示例提供，不应直接导入。

如果您查看扩展代码，您会看到它带有此警告：

/*
* This is an extension and not part of the main GoJS library.
* Note that the API for this class may change with any version, even point releases.
* If you intend to use an extension in production, you should copy the code to your own source directory.
* Extensions can be found in the GoJS kit under the extensions or extensionsTS folders.
* See the Extensions intro page (https://gojs.net/latest/intro/extensions.html) for more information.
*/

使用 webpack 导入 gojs 扩展

Import gojs extension using webpack

javascript

gojs

webpack

laravel-8