本文介绍了使用 require(lib) 与 <script>在电子应用程序中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我不知道何时使用 require('jslib')<script src=""></script>电子内容页面(例如 index.html).使用jQuery,我发现需要按如下方式加载:

<script>window.$ = window.jQuery = require('./js/jquery-2.2.4.min.js');</script>

我需要开始使用其他一些库(例如 Handlebars、ds3.js、Bootstrap 等),我不确定是否应该使用 <script> 标签加载这些库,或者如果我应该要求他们.

解决方案

在模块捆绑器之前,必须通过 <script> 标记或通过模块加载器(例如

那么你应该使用哪种方法呢?

Electron 公开了原生 Node.js require 函数.不利用这一点将是一种耻辱:您可以按名称要求包,并将您的代码拆分为可重用的模块,就像在任何 Node.js 应用程序中所做的那样.

I don't have a handle on when to use require('jslib') versus <script src=""></script> in Electron content pages (e.g. index.html). With jQuery, I discovered that it needs to be loaded as follows:

<script>window.$ = window.jQuery = require('./js/jquery-2.2.4.min.js');</script>

I need to start using some other libraries (e.g. Handlebars, ds3.js, Bootstrap, etc.) and I am not sure if I should be loading those with the <script> tag or if I should require them.

解决方案

Before module bundlers, libraries would have to be imported either via a <script> tag or via module loaders such as RequireJS.

Now it's easier to assume a CommonJS environment and get everything through a module bundler which will expose a require function for you in a browser context.

All of this is not necessary in the context of an Electron app:

Cf. renderer process

That means that the native Node.js require function (amongst other things) is available in your renderer process!

Here's a simple Electron app to prove it:

My package.json:

{
  "name": "foobar",
  "version": "1.0.0",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "devDependencies": {
    "electron": "^3.0.7"
  },
  "dependencies": {
    "the-answer": "^1.0.0"
  }
}

My main.js: (the main process)

const {app, BrowserWindow} = require('electron');

let mainWindow;

function createWindow () {
  mainWindow = new BrowserWindow({width: 800, height: 600})
  mainWindow.loadFile('index.html');
}

app.on('ready', createWindow);

My index.html: (the renderer process)

<!DOCTYPE html>
<html>
  <body>
    <script>
      const os = require('os'); // Standard Node.js module
      const answer= require('the-answer'); // An NPM package that returns the answer to everything.
    </script>
    <button onclick="alert(os.platform())">YOUR PLATFORM</button>
    <button onclick="alert(answer)">THE ANSWER</button>
  </body>
</html>

So which method should you use?

Electron exposes the native Node.js require function. It would be a shame not to leverage this: you would be able to require packages by their names and split your code into reusable modules as you would do in any Node.js apps.

这篇关于使用 require(lib) 与 &lt;script&gt;在电子应用程序中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

05-29 05:45
查看更多