Visual Studio 2017中使用Libman管理客户端库

什么是Libman

微软在Visual Studio 2017 15.8版本中内嵌了一个新的工具Library Manager。

Library Manager(简称Libman)是一个客户端库管理工具， 使用它可以很容易的管理项目中使用的客户端js库, css库等，Libman相当于一个针对客户端库的Nuget，而且Libman并不是指针对.NET项目的，非.NET项目也可以使用。

注意： 这个工具暂时只是一个实验阶段的工具。

如何使用Libman

下面我们来通过一个小例子演示一下如何使用Libman

添加项目

为了体现Libman并不只针对.NET项目，我们创建一个空文件夹Code, 并在其中创建一个名为libs的子目录, 并使用Visual Studio 2017以Website的方式打开它

然后我们可以右键点击code站点, 选择Manage Client-Side Library

点击之后，code目录中就会生成一个libman.json文件, libman.json是Libman的配置文件，其默认内容如下

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": []
}

libman.json中的配置项

• defaultProvider

  这个参数指定了默认使用客户端库的来源, Libman提供了3种可选的来源。

  • cdnjs - 默认来源
  • filesystem - 来自本地文件
  • unpkg - 一个全球cdn

• defaultDestination

  客户端库的默认存储位置

• libraries

  客户端库列表

添加jQuery 3.3.1

下面我们修改libraries节点中，添加对jquery 3.3.1的引用

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": [
    {
      "library": "jquery@3.3.1",
      "destination": "libs/jQuery_3.3.1",
      "provider": "cdnjs"
    }
  ]
}

• library - 客户端库的名称, 格式是“包名@版本号”
• destination - 客户端库在当前项目中的存储位置
• provider - 客户端库的来源

这里如果你不是粘贴代码话，手动输入会出现代码提示，Visual Studio会根据你的输入匹配最接近的包名并列出所有可用的版本。

手动恢复客户端库

修改完成后，我们右键点击libman.json， 选择Restore Client-Side Libraries

我们所需的客户端库就自动下载并导入到项目指定目录中了。

Build时自动恢复客户端库

除了手动恢复客户端库，Visual Studio还提供了一个Enable Restore Client-Side Libraries on Build的选项，即项目Build时自动恢复所需的客户端库。

选择该项之后，Visual Studio会弹出一下提示

点击确认之后，项目中会出现一个package.json, 里面添加了对Microsoft.Web.LibraryManager.Build库的引用

<?xml version="1.0" encoding="utf-8"?>
<packages>
  <package id="Microsoft.Web.LibraryManager.Build" version="1.0.163" targetFramework="net40" />
</packages>

如果当前是一个.NET项目，这个引用会出现在csproj文件中

<Project Sdk="Microsoft.NET.Sdk.Web">  
  
<PropertyGroup>  
   <TargetFramework>netcoreapp2.1</TargetFramework>  
</PropertyGroup>  
  
<ItemGroup>  
   <PackageReference Include="Microsoft.AspNetCore.App" />  
   <PackageReference Include="Microsoft.Web.LibraryManager.Build" Version="1.0.163" />  
</ItemGroup>  
  
</Project>  

总结

Libman是对Visual Studio很好的补充(之前大部分都是使用bower等类似组件来管理), 它可以帮助开发人员管理客户端库，避免了开发人员手动下载并引入客户端库造成混乱，有兴趣的同学可以尝试一下。