如何在使用'require'时从库中加载CSS

我正在build设和electron应用程序。 其中,我有一个preload脚本的webview 。 在脚本里面,我想用sweetalert

我用npm install --save sweetalert 。 在我的脚本里面,我加载require('sweetalert')并用swal("Hello world!");调用它swal("Hello world!"); 。 我现在注意到它看起来不正确,因为警报缺less所需的CSS文件 。 但是我用require('sweetalert')加载它,这很好,因为sweetalert可以保留在node_modules目录中,我不必关心它,但是它的CSS是它的一个组成部分,没有被拉同样的方式。

现在,解决这个问题的build议方法是什么? 请记住,我在一个javascript文件,并希望保持这种方式。 我真的必须去获得CSS文件, 并以某种方式注入 ? 而且我该怎么做,因为它在node_modules里面? 在testing之后,由于内容安全策略 ,似乎在这种特殊情况下无法完成。

无论哪种方式,与require声明相比,这看起来非常笨重,但对于不可用的简单解决scheme,似乎很奇怪。

我不熟悉sweetalert,但希望这有助于。

您的require语法应该与此类似。

 var sweetalert = require('sweetalert') 

然后,您应该能够使用以下语法访问sweetalert对象上的方法。

 sweetalert.someMethod() 

记住只需要返回一个JavaScript对象。 这些对象通常具有允许某些function的方法。 如果你想添加sweetalert到你的页面,你可能需要在html中注入它,否则sweetalert模块中的javascript将需要dynamic创build包含CSS的html。 我希望澄清一些事情,并帮助你更好地理解一些内部运作。

您必须像通常在浏览器中那样包含它,例如在index.html中。 将它从模块文件夹中复制到您的css文件夹中(如果有的话)并将其链接到链接标记。 这取决于你是否使用普通电子或其他样板模板,有一个吞咽/咕噜工作stream程在哪里坚持它,但这是真的,电子只是一个浏览器运行您的JS / HTML所以它是真正的相同处理。 只需要加载JS模块而不是样式。

如果你想dynamic地包含它,你可以使用和普通浏览器相同的技术(例如document.write / create element)。