我需要使用BrowserView
将NPM软件包注入executeJavaScript
。包是Web3,这是到目前为止我尝试过的。
import Web3 from 'web3'
const web3 = '' + Web3; // stringify the Web3 class
view.webContents.executeJavaScript(`
const provider = // ... provider got injected successfully because it doesn't have dependencies.
const web3 = new ${web3}(provider);
`)
但是这会引发以下错误。
Uncaught ReferenceError: core is not defined
at new Web3 (<anonymous>:45:5)
at <anonymous>:41:16
Web3试图加载其core dependency,但不幸的是没有得到字符串化。
所以我的问题是,如何将整个程序包加载到BrowserView
中?如果您无法控制<script />
标签(至少我不知道如何将它们注入Electron中),又如何在浏览器中加载npm软件包?
更新:
由于OJ Kwon在评论中的建议,我尝试通过运行将Web3与Browserify捆绑在一起
browserify packages/web3/src/index.js -o web3-bundle.js
。它似乎起作用了,因为在捆绑文件(web3-bundle.js
)的末尾它说:
// ... 50k+ lines long file
var version = require('../package.json').version;
var core = require('web3-core');
var Eth = require('web3-eth');
var Net = require('web3-net');
var Personal = require('web3-eth-personal');
var Shh = require('web3-shh');
var Bzz = require('web3-bzz');
var utils = require('web3-utils');
var Web3 = function Web3() {
var _this = this;
// sets _requestmanager etc
core.packageInit(this, arguments);
this.version = version;
this.utils = utils;
this.eth = new Eth(this);
this.shh = new Shh(this);
this.bzz = new Bzz(this);
// overwrite package setProvider
var setProvider = this.setProvider;
this.setProvider = function (provider, net) {
setProvider.apply(_this, arguments);
this.eth.setProvider(provider, net);
this.shh.setProvider(provider, net);
this.bzz.setProvider(provider);
return true;
};
};
Web3.version = version;
Web3.utils = utils;
Web3.modules = {
Eth: Eth,
Net: Net,
Personal: Personal,
Shh: Shh,
Bzz: Bzz
};
core.addProviders(Web3);
module.exports = Web3;
现在,我正试图像这样导入并包含它:
const Web3 = require('./web3-bundle.js');
这不起作用。它说undefined
不是构造函数。
const Web3 = require('./web3-bundle.js').Web3;
和
const Web3 = require('./web3-bundle.js').default;
两者都不起作用。应该怎么做?
更新2:进一步检查包,它使用exports.
和module.exports =
。我的编辑器仅建议使用exports.
导出为可导入的方法和对象🤔
我建议您使用此样板或包含良好Webpack配置(suggested boilerplate)的样板。
请遵循以下步骤:
yarn install
yarn add web3
import Web3 from 'web3';
添加到app/containers/HomePage.js
文件(反应渲染视图)。