在 Electron 应用程序中使用 require(lib) 与 <script>

Question

我不知道何时在 Electron 内容页面（例如 index.html）中使用require('jslib')vs。<script src=""></script>使用jQuery，我发现它需要按如下方式加载：

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

我需要开始使用其他一些库（例如 Handlebars、ds3.js、Bootstrap 等），但我不确定是否应该使用<script>标签加载这些库，或者是否应该加载require它们。

Answer 1

有些库仅通过 CommonJS 接口公开其变量。其他的，比如 jQuery，也将它们公开为全局变量。

您不能只<script src="..."></script>对仅通过 CommonJS 公开的库进行操作，因为它不会绑定到全局空间。

与 CommonJS 绑定

module.exports = myLibrary;

绑定到全局范围

window.myLibrary = myLibrary;

如果库只执行前者，那么您将无法在不使用 的情况下访问该值require。如果库只执行后者，那么您将无法require从以下意义上访问它：const myLibrary = require('my-library')

一般来说，使用 CommonJS 比全局变量更好。将变量添加到全局范围可能会导致名称冲突，直接加载到依赖项中可以让下一个人更容易地知道该依赖项来自哪里。更不用说，CommonJS 允许静态分析工具更好地工作，因此您更有可能获得相关的代码完成和类型定义。

以jQuery为例，这样使用会更好。

// main.js
const $ = require('./js/jquery-2.2.4.min.js');
// could also be done like this if you install it as a Node dependency
// const $ = require('jquery');

$(document).ready(...);

<!-- index.html -->
...
<script src="main.js"></script>

长话短说

尽可能使用require('my-library')，否则将它们加载为全局变量。