“npm 安裝”如何<module> &quot; 用於開發面向瀏覽器的頁面？

Question

將資源添加到在瀏覽器中運行的頁面時，我要么鏈接到該文件（在本地，由 Web 服務器提供，或在 CDN 上）

<link rel="stylesheet" href="https://somecdn.com/mycssresource.min.css">
<script src="alocalscript.js"></script>

或者使用 webpack 最終將npm安裝的模塊捆綁到一個bundle.js ，由我的 Web 服務器提供服務。

在閱讀框架的文檔時，我經常看到（最近在Bulma 中）推薦的安裝框架的方法為

npm install <framework>

我了解 Node.js 程序的用法（所有內容都在服務器上本地運行，因此框架的來源在那里有其位置）但是對於基於瀏覽器的開發，由npm install位於node_modules的文件最終必須使它們的到代碼實際運行的瀏覽器的方式。

通過npm install安裝框架的建議（或首選）是否適用於用於瀏覽器的代碼，還是僅適用於 Node.js 或 webpack（或類似的捆綁器）使用？

Answer 1

我個人更喜歡通過 npm install 安裝，然后使用相對 URL，例如/node_modules/.../filename.css 。

我也知道有些人更喜歡復制包的 css/js 並從他們自己的目錄中為它們提供服務，例如/assets/css/...或/assets/js/.. 。 通過這種方式，他們可以根據需要編輯/添加到原始框架並保留更改，因為他們在 git 中提交了更改。

另一個非常流行的選項是 CDN，許多人建議使用它來獲得緩存的一大優勢，特別是如果用戶已經下載了該文件，因為它在他們訪問的另一個網站中使用過，那么他們加載您的應用程序/網站會更快因為他們將這些文件本地緩存在瀏覽器中，而不必重新下載。