如何在不使用 CDN 的情况下自动安装诸如 bootstrap、jquery 和 font-awesome 之类的 Web 资产？答案

【问题标题】：How do I automatically install web assets like bootstrap, jquery and font-awesome without using CDN?如何在不使用 CDN 的情况下自动安装诸如 bootstrap、jquery 和 font-awesome 之类的 Web 资产？
【发布时间】：2017-07-15 15:54:44
【问题描述】：

我想知道是否可以自动安装 jquery/bootstrap/font-awesome，而不是通过 npm 安装然后手动将代码拖到我的 css/js/fonts 文件夹中？没有程序可以更新并自动将它们拖到正确的文件夹吗？

我知道人们说您可以手动将 javascript 文件拖到正确的位置，但例如 bootstrap 包含多个 javascript 文件。它包括字体和 css 文件。
如果我以这种方式包含它们：

\网络
-\css
--\应用程序
---\main.css
--\font-awesome
---\font-awesome.min.css
-\字体
等等

那么它就行不通了，因为 font-awesome 期望它的字体在一个文件夹旁边。

【问题讨论】：

我不喜欢 w3schools。我不信任 w3schools。
你不清楚吗？首先，您所要做的就是将文件放在一个文件夹中并使用脚本标签链接到它，您无需安装任何东西。其次，CDN 通常是可以信任的，Google 和 MS 将这些脚本作为服务托管。
您可以下载 javascript 文件并在您的项目中引用它们。
您可以简单地将cdn中的所有代码复制粘贴到一个javascript文件中，并以与包含其他js文件相同的方式包含此javascript文件
但是没有程序可以自动执行此操作吗？并且 javascript 文件确实使用字体和 css 不是吗？

标签： javascript jquery css twitter-bootstrap npm

【解决方案1】：

JQuery、Bootstrap 和 Fontawesome 不是您安装在网页中的软件或应用程序。它们只是 CSS 和 Javascript 文件。因此，这些就像您可能从头开始为您的网页编写的任何其他 javascript 或 CSS 文件一样。除了它们维护良好，高度优化并针对特定应用程序制造。（与 Bootstrap 一样，主要目的是提供一个框架，让网页具有响应性。）

要将它们包含到网页中，您所要做的就是告诉 HTML 文件使用这些文件。这是通过使用<script> 标记及其src* 属性将它们链接到HTML 来完成的。（*W3schools 链接。呵呵）。

现在在src 属性中，您可以提供指向包含该文件的网络位置的 URL，或者您可以提供指向您的服务器或本地计算机中包含该文件的位置的相对本地路径。是的，您可以手动将文件拖到您的 css/js 文件夹中，并使用该路径包含文件。不，我不知道有任何软件可以自动化该过程。但是您只需将文件放在一个位置，整个网页及其子页面即可访问它。所以这不是一个非常密集的过程。

至于 CDN 为何托管此类文件以供公众访问，这里给出了见解：How cloudfare provides free service。和安全，嗯，他们非常安全，他们的工作就是提供对他们托管的文件的安全访问。而为什么人们首先使用 CDN 是因为 this（简称性能）。

更新：至于如何在 HTML 中包含文件，它是这样的（引导示例）：

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

您需要提供所需 CSS 和 JS 文件的路径。在 Bootstrap 的情况下，只有这两个是您需要包含的才能获得库的全部功能。

【讨论】：

“提供对他们托管的文件的安全访问实际上是他们的工作。”关于云也可以这样说。我拒绝将内容信任给第三方。
是的，呵呵。我们都有信任问题。网络上的任何东西或任何地方是否真的安全或私密是另一个问题。但是，在私人第三方托管服务上托管您的网页或数据库呢？你信任他们。所以这完全取决于你想妥协多少。我认为，对于不会面临大量流量的页面，使用来自服务器而不是 CDN 的这些文件会很好。所以最后它总是你的电话。
“但是在私人第三方托管服务上托管您的网页或数据库怎么样？”我计划在去中心化网络 MaidSafe 上托管我的网页。
+1。谢谢，我不知道 MaidSafe。看起来是一个非常有趣的想法。我想你最好不要使用 CDN，而只使用 MaidSafe DN。
CDN 也会导致您的 .js 文件被缓存，因此如果用户已经通过访问另一个网站从 CDN 加载了 jQuery，他不必再次下载它来访问您的网站。这是一个巨大的优势！

【解决方案2】：

我认为在您没有离线工作之前，使用本地文件而不是 CDN 并不是一个好主意。

您可以在此处了解 CDN 与本地文件：

https://halfelf.org/2015/cdn-vs-local/

Multiple files on CDN vs. one file locally

https://www.sitepoint.com/7-reasons-to-use-a-cdn/

虽然有另一个链接正好相反：

7 Reasons NOT to use a Content Delivery Network

不过，如果您想在本地使用这些文件，您可以按照以下说明进行操作：

移至项目中的 cdn 链接
从 src 或 href 复制链接并在浏览器中打开。
在本地保存文件，并在您的项目中提供文件的引用。

【讨论】：