将 Qlik 与 Webpack 1 结合使用

Question

我正在使用 webpack 1 尝试从一个名为 Qlik 的产品导入一个以 amd 模块模式编写的外部 js 文件，该产品执行可视化。

该项目使用角度全栈 yeoman 生成器，因此 webpack 配置文件为：https://github.com/angular-fullstack/generator-angular-fullstack/blob/master/templates/app/webpack.make.js

尝试在 webpack 环境中让这样的东西工作： https://gist.github.com/mindspank/905294636006b3b530a0#file-index-js-L19

我想导入和使用的文件：https://sense-demo.qlik.com/resources/js/qlik.js

我已经尝试了像 scriptjs 这样的东西来加载它，但 webpack 无法解决它。

$script('https://sense-demo.qlik.com/resources/assets/external/requirejs/require.js', () => {
require.config = {
baseUrl: 'https://sense-demo.qlik.com/resources'
}
require(['js/qlik'], qlik => {
let app = qlik.openApp(...);
}
});
// throws Module not found: Error: Cannot resolve module 'js/qlik'

我还尝试将其本地添加到项目中并在 webpack 中引用它：

config.externals = {
'qlik' : 'commonjs2 ./client/assets/js/qlik'
}
usage:
require(['qlik'], qlik => {
console.log(qlik);
});
// throws Uncaught ReferenceError: require is not defined

或

config.resolve = {
root: [
path.join(__dirname, ('/client/assets/js'))
]
};
// throws tons of errors similar to:
ERROR in ./client/assets/js/qlik.js
Module not found: Error: Cannot resolve module 'cm.matchbrackets' in clientassetsjs

我的问题是，我不知道如何通过 webpack 使用这个外部脚本。 在 scriptjs 中运行时，它无法解决'js/qlik'问题，保存 qlik 脚本并在本地添加它们并没有更好。

任何帮助将不胜感激！

Answer 1

也许这会有所帮助？

我们使用 Webpack 2 和 Angular2(带有 TypeScript)，并通过在 HTML 文件中包含 Qlik 的需求.js，然后在全局范围内引用它来解决它，如下所示：

const requireJs = (<any>window).requirejs;
const requireJsConfig = {
host: <url>,
prefix: '/',
port: <port>,
isSecure: true
};
const qlikConfig = {
appId: <appId>,
objectId: <objectId>
};
requireJs.config( {
baseUrl: ( requireJsConfig.isSecure ? 'https://' : 'http://' ) + requireJsConfig.host + (requireJsConfig.port ? ':' + requireJsConfig.port : '') + requireJsConfig.prefix + 'resources'
});
requireJs(['js/qlik'], function (qlik) {
let const = qlik.openApp(qlikConfig.appId, requireJsConfig);
app.getObject(<container-div>, qlikConfig.objectId);
});