ReactJS - 如何在窗口上设置属性？

我遇到了一个陌生的场景。在我的React项目中，我导入了第三方供应商的api文件。但是，供应商api使用Q promise库进行内部调用，这不包括在内。 api期望window.Q被设置，并且是api的直接依赖。我似乎无法弄清楚如何正确设置这个窗口上，这样，当我输入了供应商档案在我的源文件的顶部，并使用它，它不会抛出这个错误：ReactJS - 如何在窗口上设置属性？

TypeError: undefined is not an object (evaluating '$q.defer')

全球variables.js：

注：我进口的供应商库中的这个文件，因为ds是消费者作出与调用文件中创建一个全局变量。

import '../../vendor/vendor-library'; 

const globals = { 
    DATA_SERVICE: ds, 
}; 

export default globals;

user.js的：

import globals from '../globals/global-variables'; 

const userApi = { 
    getCurrentUser() { 
     return globals.DATA_SERVICE.getDataForCurrentObject('User', 'ID'); 
    }, 
}; 

export default userApi;

我试图在我的项目进入点的顶部这样做，但它并没有解决这个问题：

index.js：

import q from 'q'; 
window.Q = q;

任何帮助将不胜感激。

来源

2017-03-01 kkSlider

听起来像一个很不好的图书馆。除非需要，否则我可能会重新评估是否有更好的方法。您的应用程序只与最不安全的依赖项一样安全...... –

FWIW，如果您仍然需要使用它，您可以在此文章中做类似的操作：https：//github.com/webpack/webpack/issues/ 542 –

嘿滑块我正在浏览你的代码，如果你能给我更多关于你正在使用的厂商api的信息会有所帮助。看到'Q'以他们'需要'的方式使用是很奇怪的;通常我熟悉的'q'是一个npm模块。 package.json中存在的模块。 –

我会推荐使用由webpack或其他任何捆绑器提供的扩展来捆绑您的javascript以提供Q作为全局。

在的WebPack这可能与webpack.ProvidePlugin

实例来完成：

module.exports = { 
    module : { 
     ... 
    }, 
    plugins : [ 
     new webpack.ProvidePlugin({ 
      Q: "q", 
      "window.Q": "q", 
     }), 
    ], 
};

在这种情况下"q"是Q library from npm，你必须添加作为依赖于你的项目的名称。

来源

2017-03-02 00:51:09 Mobius

工作就像一个魅力。谢谢！ – kkSlider

ReactJS - 如何在窗口上设置属性？

回答

相关问题