如何使用 Visual Studio 配置 Bower？

Question

隨着我的 Web 項目的復雜性不斷增加，我意識到手動下載外部 JavaScript 庫容易出錯、耗時並且隨着時間的推移使項目的可維護性降低。

雖然 Visual Studio 有 NuGet 包管理器，但它不如 bower 強大。 此外，並非所有外部庫都在 NuGet 上發布。

但是沒有關於如何使用 Visual Studio 配置 bower 的明確幫助。 請幫忙 ！

Answer 1

隨着我的 Web 項目的復雜性增加，我意識到手動下載外部 JavaScript 庫容易出錯、耗時，並且隨着時間的推移降低了項目的可維護性。

雖然 Visual Studio 有 NuGet 包管理器，但它不如 bower 強大。 此外，並非所有外部庫都在 NuGet 上發布。

所以，我決定冒險嘗試並開始使用 bower。

我的項目結構現在更加簡潔且易於維護。

---

在這里，我列出了使用 Visual Studio 配置 Bower 所需的步驟。

使用 bower 的詳細步驟已在http://bower.io/#install-bower 上提供。 在這里，我將列出我采取的步驟

• — 安裝涼亭

• — 使用 Visual Studio 進行配置

• — 下載示例包 — ( AngularJS )

---

Bower 需要 node、npm 和 git for windows。

在繼續之前，請安裝以下內容

• 適用於 Windows 的 git – 從https://msysgit.github.io/安裝
• 節點 - 從https://nodejs.org/安裝
• npm 是 node 的一部分（不需要任何額外的步驟）

---

第1步

打開命令提示符並執行命令

npm install -g bower

如果您使用的是公司代理服務器，則上述步驟可能會失敗。 要在 npm 中添加代理服務器設置，請從命令提示符執行以下 2 個命令

npm config set proxy http://proxy.myCompany.com:80

npm config set https-proxy http://proxy.myCompany.com:80

完成后，再次嘗試安裝 bower

---

第2步

從命令提示符導航到 Visual Studio 項目文件夾。

執行命令

bower init

• 將此文件包含到 Visual Studio 項目中。 您可能需要從“解決方案資源管理器”菜單中單擊“顯示所有文件”。

---

第 3 步

使用記事本和以下配置創建一個 .bowerrc 文件並將其保存在您的 Visual Studio 項目文件夾中

{
"directory": "scripts/bower_components",
"proxy":"http://proxy.myCompany.com:80",
"https-proxy":"http://proxy.myCompany.com:80"
}

• 將此文件包含到 Visual Studio 項目中。
• 編輯此文件以設置要由 bower 下載的軟件包的目錄
• 如果您在公司代理后面工作，請添加代理服務器設置。 否則刪除代理和 https-proxy 的最后兩行

---

第四步

要下載 AngularJs，請執行命令

bower install angular –save

這將在 bower.json 中添加一行。

第 5 步

包會默認下載在 bower_components 目錄下。 （或在 .bowerrc 文件中提到的目錄下）

確保在 Visual Studio 項目中包含整個包目錄。

• 點擊顯示所有文件
• 右鍵單擊新下載的包，然后單擊“包含在項目中”

第 6 步

最后將新包的引用添加到您的 index.html

---

Answer 2

我發現我還需要配置 git 才能使用代理服務器：

git config --global http.proxy http://username:password@proxyURL:8080

在那個涼亭在 VS 2015 中工作之后

Answer 3

我已經研究了Net Core 2.2的問題，微軟似乎已經停止使用Bower。

查看此鏈接

Visual Studio 2017 ASP.NET MVC核心模板中的Bower替換