javascript - 使用纯 npm 构建在 NW.js (node-webkit) 应用程序中加载 Bootstrap

Question

我正在尝试使用 NW.js 构建一个简单的桌面应用程序.受到一些帖子的启发，包括 this one ，我想尝试一种没有任何 bower、grunt 或 gulp 的纯 npm 方法。

所以我继续使用作为 npm 模块安装的 jquery 和 bootstrap 库。当我像这样在我的应用程序的 javascript 中注入(inject)模块时:

global.jQuery = $ = require("jquery");
var bootstrap = require("bootstrap");

我从 bootstrap 得到一个 ReferenceError: document is not defined。我可以用老式的方式通过 html 文档加载 bootstrap:

<script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.js"></script>

我在问自己，通过脚本文件中的 require 加载 bootstrap 是不是一个愚蠢的想法？基本上，我在那里不需要它。它可以通过 html 中的脚本标签加载。最佳做法是什么？我糊涂了。

更新。解决方案

听从@Kuf 的建议，我创建了一个build.js 脚本

var copyfiles = require('copyfiles');
copyfiles(["node_modules/bootstrap/dist/js/bootstrap.js", "vendor/js"], true, function (err) {
    if (err) return console.error(err);
});
copyfiles(["node_modules/bootstrap/dist/css/bootstrap.css", "vendor/css"], true, function (err) {
    if (err) return console.error(err);
});

由 prestart 钩子(Hook)触发:

"scripts": {
  "build": "node build.js",
  "prestart": "npm run build"
}

它允许我通过方便的路径访问 bootstrap 资源:

<link href="vendor/css/bootstrap.css" rel="stylesheet">
<script type="text/javascript" src="vendor/js/bootstrap.js"></script>

Answer 1

我认为发生错误是因为您在没有窗口上下文的情况下运行 require。你从哪里运行包含？请注意，对于从 node-main 运行的代码:

window: ... is not available at the time the script is loaded, because the script is executed before the DOM window load. (source)

即使在使用 require 导入 JS 时，您仍然需要包含 css 文件。我认为目前还没有“干净”或开箱即用的解决方案。尽管您所做的肯定会起作用，但它会生成奇怪且不自然的脚本路径。

我会添加一个构建 script :

"scripts": {
    "build": "node build.js"
  }

在 package.json 中将 bootstrap 从 node_modules 复制到 '/dist/' 以使路径更清晰。