logo标签列表

Visual Studio 2017 ASP.NET MVC Core模板中的Bower替代方案

asp.net-mvcvisual-studioasp.net-corebowervisual-studio-templates
23
最近我使用Visual Studio 2017（15.6.3）从头创建了一个ASP.NET MVC Core项目。我发现了通常的JavaScript框架：
  • bootstrap
  • jquery
  • jquery-validation
  • jquery-validation-unobtrusive
但不幸的是，所有的Bower支持都消失了！没有bower.json、.bowerrc，也没有“管理Bower包...”选项:

enter image description here

Visual Studio的ASP.NET MVC Core模板有什么问题？是Bower已经过时了吗？
如果Bower已被弃用，请不要将此问题复制到在Visual Studio 2017中如何使用Bower包中！我不希望修复指向弃用技术的解决方案。
我想缩小问题范围：最简单（最直观）的用NPM替换Bower的方法是什么？就像Bower使用它的.bowerrc文件一样： { "directory": "wwwroot/lib" }？
我向供应商描述了我的问题：https://developercommunity.visualstudio.com/content/problem/225023/aspnet-core-web.html - Marcel
对于客户端框架，我不明白为什么你想要用NPM替换Bower。你可以手动添加bower.json以在Visual Studio中获得支持，或者按照我的指南在这里https://dev59.com/BFcO5IYBdhLWcg3weBaZ#49713851（在命令提示符中运行“bower init”将为您创建它）。 - MartinF
2
@MartinF Shawn Wildermuth说：“Bower已经被弃用，所以对于新的开发项目...”。Bower本身发布了：“...我们建议在前端项目中使用Yarn和Webpack...”上周我还向德国著名专家Dr. Holger Schwichtenberg询问过，他证实Bower已经死亡。 - Marcel
Library Manager（内置于Visual Studio中）使这变得非常容易。右键单击您的项目>添加>客户端库。结果将保存到项目根目录中的libman.json文件中。 - user875234
6个回答
17

Bower 已经停止维护。

微软推出了一个轻量级并且目前还比较低调的解决方案，叫做 Library Manager (LibMan)。

它是一个基于 JSON 的简化解决方案，并且拥有非常简单易用的用户界面——能够让您控制下载哪些文件（不再需要下载数百个文件，当您只需要其中的一个时）。

Mads Kristensen 在 Build 2017 演示了一个非常棒的预览版。 （该视频应该会在大约 43 分钟 34 秒处开始。）

撰写此文时，LibMan 仍处于预览状态，但将随 Visual Studio 15.8 一起发布。

如果您想在此之前尝试它，可以从GitHub Repo或Visual Studio Marketplace获取它——在解决此问题的方案中有说明。

您仍然可以使用npm等工具-不过这里是微软使用此工具（或同时使用）的原因——来自Visual Studio Marketplace：

使用此扩展的原因

  • 针对目前未使用其他包管理器的应用程序
  • 针对您认为Bower和npm过于繁琐的项目
  • 针对不想使用Bower或npm的开发人员
  • 针对在其工具中重视简洁的开发人员
  • 用于自定义或私有的包/文件
  • 用于NuGet无法安装内容包的ASP.NET Core应用程序
我刚刚测试了"LibMan"。它最适合我的需求：在我的.NET Web应用程序中获取轻量级JavaScript包的轻量级解决方案。就像在旧日子里我们通过NuGet下载它们一样 :-) - Marcel
所以..在VS 15.7.5中真的没有安装LibMan的方法，如果想要使用它，必须更新至至少15.8（最初的问题是15.6.3）？ - FredyWenger
1
有预览版本 - 但为什么不直接更新呢？ - niico
9

Bower已经停止维护。Bower团队建议使用Yarn（NPM的一个补充）。

由于Visual Studio支持NPM，所以我会选择它。

在你的项目根目录下创建一个package.json文件（右键点击项目，添加项并搜索NPM，你会找到一个npm配置文件）：

{
  "name": "SomeName",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "bootstrap": "3.3.7",
    "jquery": "3.3.1",
    "jquery-validation": "1.17.0",
    "jquery-validation-unobtrusive": "3.2.10",
    "jquery-ajax-unobtrusive": "3.2.4",
  }
}

每次您更改json文件时，只需按CTRL + S。Visual Studio会自动调用NPM并还原包。另外，请注意，您可以使用智能感知来查看包名称和版本号。
迁移后，我已经不记得在npm上找不到软件包了。但如果您遇到这种情况，请注意，您可以直接引用github存储库。
依赖项保存在node_modules文件夹中。这是新的包管理器。
现在您需要将其打包以进行发布（这也应该使用bower完成）。捆绑是将JavaScript/CSS/Image资源组合成单个bundle.js，bundle.css，sprite.svg的过程。这些应该复制到wwwroot文件夹中。
为此，我们有几个选择（我只会链接到一些，因为这会扩大问题的范围）：
Library Manager 似乎是一个更好的解决方案。 - user875234
1
那么，我会完全停止使用Bower。你知道NPM何时进入Visual Studio的项目模板吗？ - Marcel
2
我必须尊重但强烈反对。为什么要在ASP.NET应用程序中使用npm来管理客户端库？它甚至没有得到很好的支持。npm install bootstrap --save甚至不能安装bootstrap的依赖项。这是包管理器的一个不可接受的失败。在我看来，Library Manager似乎是正确的解决方案。 - user875234
@user875234 我同意使用Library Manager（libman）可能是正确的选择，因为Bundler＆Minifier扩展程序没有得到更新。我们发现包安装程序运行良好，并且使用npm意味着所有文件都整齐地放在node_modules文件夹中，我们正在使用BundlerMinifier来管理所有JS的位置，这对我们来说是一个很好的解决方案，无论您是否同意。有时候只是关于如何使用工具而不是您从中期望什么。 - Mark Redman
1
这个解决方案没有问题——经过了很多研究，我发现Libman缺少我使用的许多库——通过npm安装，然后使用bundleconfig.json对我来说效果很好。 - Jesse
1
1
解决方案是执行以下操作：
  1. Launch VS 2017 and open Tools - Extensions and Updates from the main menu
  2. In the window that opens, select Online on the left menu and type package in the Search box. Download the Package Installer
  3. Close all VS instances and wait a while, the VS installer will start which will install that package
  4. After installation, start VS and your project that should have a bower
  5. Start Project - Quick Install Package from the menu
  6. Select npm and type upgrade -g bower in the field
  7. The previous command will update the locations of the bower packages. Now create the bower.json file manually as follows:
    1. Right-click on the project and Add - New Item
    2. Select the JSON file and name it bower.json
    3. Open the file and type in the following file: {"name": "myproject"}
    4. Create another JSON file that you will only call .bowerrc
    5. Open the .bowerrc file and type the following: 
    {
    "directory": "wwwroot / lib /",
    "registry": "https://registry.bower.io"
}
  8. Right-click the bower.json file and select the Manage Bower Package option.
  9. In the Browse section, type mustache.js and install
  10. When you click on Project in the window you will see Manage Bower Package

那就是全部！

0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接