如何将uploadcare导入react.js项目

How can I import uploadcare into a react.js project?

本文关键字：react js 项目 导入 uploadcare      更新时间：2024-06-20

如何将uploadcare导入react.js项目？

我的进口部分看起来像这个

    // main imports
    import React from 'react';
    import {render} from 'react-dom';
    import { Router, Route, hashHistory } from 'react-router'
    import jQuery from '../scripts/jquery-1.8.3.min.js'
    import uploadcare from '../lib/uploadcare.min.js'

然后我想像这样使用uploadcare（通过javascript API）：

onAddPhotosClick: function() {
    console.log("++ add photos");
    uploadcare.openDialog(null, {
        publicKey: "xxxxxxxxxxxx",
        imagesOnly: true,
        tabs: "file url facebook gdrive dropbox instagram evernote flickr skydrive"
    });
},

我的代码到达openDialog行，然后抛出以下错误：

:8081/static/react_build/bundle.js:86 Uncaught TypeError: _uploadcareMin2.default.openDialog is not a function

早些时候，在页面加载过程中，我的控制台记录：

Global public key not set. Uploads may not work!
Add this to the <head> tag to set your key:
<script>
UPLOADCARE_PUBLIC_KEY = 'your_public_key';
</script>
:8081/static/react_build/bundle.js:85 ++ add photos

事实上，我收到了上面的棕色警告信息（我对此表示同意，因为我希望设置直接通过javascript API的公钥使我认为uploadcare.js文件已正确包含，但uploadCareMin2错误使我认为我没有完全正确地导入它。

TL；DR；如何将uploadcare Javascript API导入react.js项目？

谢谢你的帮助。

不确定uploadcare是什么，但尝试

import '../lib/uploadcare.min.js'

看起来你是直接导入文件，这意味着你必须希望作者将文件导出为export default，以便按照你显示的方式导入。他们很可能只是把它放在全球空间里。

如果没有，也有可能他们导出了一个命名值，所以试试：

import { uploadcare } from '../lib/uploadcare.min.js';

您现在也可以使用uploadcare网站上记录的npm安装：

NPM
npm install uploadcare-widget
ES6 usage way:
import uploadcare from 'uploadcare-widget';
CommonJS usage way:
var uploadcare = require('uploadcare-widget);
相关文章：