时间戳

首页 > 解决方案 > 如何使用 webpack 让 syncfusion 在 aurelia 电子应用程序中工作？

webpack - 如何使用 webpack 让 syncfusion 在 aurelia 电子应用程序中工作？

问题描述

我有 Aurelia、Electron 和 Webpack 工作，但我想包括 Syncfusion 的 CDN 版本。在普通的 Web 应用程序中，您可以将其包含在 HTML 文件中，但如何将其包含在 Aurelia Electron Webpack 应用程序中？

在我的app.html我有以下代码：

<require from="http://cdn.syncfusion.com/js/assets/external/jquery-1.10.2.min.js"></require>
<require from="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></require>
<require from="http://cdn.syncfusion.com/16.3.0.29/js/web/ej.web.all.min.js"></require>

标签： webpackelectronaureliasyncfusion

解决方案

供您参考，Webpack 应用程序会将脚本文件捆绑在dist有助于运行 Electron 应用程序的文件夹中。

要导入 Syncfusion JavaScript 依赖文件，您可以使用以下两种方式之一：

  • main.ts在文件中导入脚本
  • 为 Syncfusion 依赖项创建自定义 JavaScript 文件

在 main.ts 文件中导入脚本

在 main.ts 文件中导入脚本，如下面的代码片段。如下导入 Syncfusion JavaScript 依赖项时，它将被捆绑在dist文件夹中。

...
import { PLATFORM } from 'aurelia-pal';
import * as Bluebird from 'bluebird';
import 'syncfusion-javascript/Scripts/ej/web/ej.grid.min';

// remove out if you don't want a Promise polyfill (remove also from webpack.config.js)
Bluebird.config({ warnings: { wForgottenReturn: false } });

export async function configure(aurelia: Aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging()
    .plugin(PLATFORM.moduleName('aurelia-syncfusion-bridge'), (syncfusion) => syncfusion.ejGrid());
...

为 Syncfusion 依赖项创建自定义 JavaScript 文件

您必须为 Syncfusion Dependencies ( ) 创建一个自定义 JavaScript 文件，并在您的文件中ej.web.all.min.js导入创建的 JavaScript文件。requireapp.html

推荐阅读