[英]Loading Bootstrap in NW.js (node-webkit) app with pure npm build
我正在尝试使用NW.js构建一个简单的桌面应用程序。 受到包括这个在内的一些帖子的启发,我想尝试一种纯粹的npm
方法,没有任何bower
, grunt
或gulp
。
所以我继续使用安装为npm
模块的jquery
和bootstrap
库。 当我在我的应用程序的JavaScript中注入模块时,如下所示:
global.jQuery = $ = require("jquery");
var bootstrap = require("bootstrap");
我得到一个ReferenceError: document is not defined
从bootstrap
ReferenceError: document is not defined
。 我可以用老式的方式通过html文件加载bootstrap
:
<script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.js"></script>
我问自己,在脚本文件中加载bootstrap trough require
是一个愚蠢的想法吗? 基本上,我不需要那里。 它可以通过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
钩子触发:
"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>
我认为发生错误的原因是您在没有窗口上下文的情况下运行require。 你在哪里运行包括? 请注意,对于从node-main
运行的代码:
window:...在加载脚本时不可用,因为脚本在DOM窗口加载之前执行。 ( 来源 )
即使使用require导入JS,您仍然需要包含css文件。我认为还没有“干净”或开箱即用的解决方案。 虽然你正在做的事情肯定会起作用,但它会产生奇怪而不自然的脚本路径。
我会添加一个构建脚本 :
"scripts": {
"build": "node build.js"
}
在package.json中将boot_rap从node_modules复制到'/ dist /'以使路径更清晰。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.