如何使用 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替换