（二）使用Yeoman创建SharePoint Framework（SPFx）项目

        这篇博客将介绍如何使用Yeoman快速创建SPFx项目，在此之前请参考上一篇博客”（一）配置SharePoint Framework（SPFx）本地开发环境“来配置本地开发环境。
         Yeoman创建的SharePoint Framework（SPFx）项目有两种，一种是客户端webpart，一种是SPFx扩展（Extension）。客户端webpart顾名思义就是可以添加到页面中的webpart，而SPFx扩展则提供以下三类针对SharePoint Online UI的扩展：

Application Customizers 页面扩展，可以向页面的特定位置注入代码，实现定制页面。
Field Customizers 字段扩展，可以自定义字段展示方式。
Command Set 命令集扩展，可以自定义页面上的操作，例如添加按钮等等，实现自己的代码逻辑。
        下面我们使用Yeoman分别创建webpart和SPFx扩展。首先简单介绍一下什么是Yeoman。Yeoman是：
一个通用的脚手架系统，可以创建任何类型的应用程序。
语言无关，你可以使用任何编程语言来创建自己的模板生成器。
Yeoman只是提供一个环境，并不做任何事情。所有的事情都是模板生成器（generator）来做的。
        可以把Yeoman理解为一个模板工具集合，想要创建什么样子的应用程序，只要使用Yeoman提供的相应的生成器即可快速地创建一个简单的应用程序。在上一篇博客中，我们通过npm安装了Yeoman以及一个微软提供的SharePoint Framework模板生成器“@microsoft/generator-sharepoint”。这个生成器就可以帮助我们快速创建SPFx的项目，这和我们之前打开Visual Studio，然后选择SharePoint项目模板创建一个SharePoint项目并没有什么区别，只不过现在使用powershell命令行操作而已。
        首先我们创建一个webpart。打开powershell，创建一个文件夹”firstwebpart“，然后进入这个文件夹中，这个文件夹就是我们的项目文件夹。所有的SPFx项目的创建都从一行命令开始：yo @microsoft/sharepoint        这个命令是启动SharePoint Framework项目模板生成器，执行完成之后会出现Yeoman的图标和创建SPFx项目的向导：



        接下来需要做的事情就是回答向导的问题，第一个问题，也是第一步”What is your solution name“是指定项目的名称，默认是当前文件夹的名称“firstwebpart“，可以输入其他的项目名称，这里我们使用默认的名称，直接按回车键进入下一个问题：



        第二个问题"Which baseline packages do you want to target for your component(s)"是指定这个webpart的运行平台，有两个选项，可以使用方向键选择，第一个选项是SharePoint Online，另一个是SharePoint 2016（也包含SharePoint Online），这两个选项将使用不同的SPFx版本来构建项目，如果选择第一个选项，则使用最新的SPFx版本，否则将使用旧的SPFx版本。有人觉得既然第二个选项既可以支持SP 2016，也可以支持Online，为什么还要有第一个选项？事实上从SP 2016开始，所有的新功能都是首先在Online上发布，然后再考虑支持SP 2016版本，所以这两个选项的差别还是不小的。这里我们选择第一个选项，然后回车键进入下一个问题：



        第三个问题”Where do you want to place the files“是指定使用当前文件夹还是创建子文件夹来存放项目文件，这个很像Visual Studio中创建项目时候的”Create directory for solution“选项。这里我们选择当前文件夹，然后回车键进入下一个问题：



        这个问题是选择如何部署这个webpart，如果选择Y，那么当这个webpart将来被添加到SharePoint的App Catalog中的时候，会自动部署到整个SharePoint租户范围内，所有用户都可以使用这个webpart。如果选择N，那么将会由SharePoint租户管理员来决定部署到哪一个站点，只有特定站点的用户可以使用这个webpart，在这里我们选择N，将由管理员决定部署到哪一个站点，然后回车键进入下一个问题：



        这个问题”Which type of client-side component to create“是我们创建一个webpart还是创建一个SPFx扩展的分界，这里我们选择WebPart选项，回车键进入下一个问题：



        这个问题需要指定webpart的名字，默认是HelloWorld，直接回车键使用默认名字，然后的问题是指定webpart的描述，使用默认即可，然后回车进入下一个问题：



        这个问题是选择一个前端框架，可以选择不使用任何框架，使用React或者Knockout，这里选择第一个选项不适用任何框架，然后回车，这个时候向导结束，Yeoman开始根据以上问题的回答创建项目，结束之后会出现Yeoman的图标和成功信息：



        现在如果我们使用Code打开firstwebpart文件夹，会看到项目的结构如下：



        这样一个SPFx客户端webpart项目就创建好了，这些文件的功能会在接下来的博客中详细说明。
        了解了如何使用Yeoman创建一个webpart项目之后，再使用Yeoman创建SPFx扩展项目（extension）就很容易了，与创建webpart项目相同，在一个新的文件夹中运行“yo @microsoft/sharepoint” 命令启动向导，与创建webpart一样回答问题，注意在向导执行到”Which type of client-side component to create“这一步的时候，要选择Extension，如下所示：



        选择Extension之后回车键进入下一个问题，选择三种扩展类型中的第一种：Application Customizer：



        然后指定页面扩展的名称和描述，即可开始创建项目了：



        创建成功！



        使用Code打开项目文件夹，可以看到所有的项目结构已经创建完毕：



        同样，如果创建一个字段扩展项目，只需要在向导里的“What type of client-side component to create”问题中选择“Field Customizer”即可；如果创建一个命令集项目，在向导里的“What type of client-side component to create”问题中选择“ListView Command Set”即可。
        以上就是使用Yeoman创建SPFx项目的过程。只需要一个命令“yo @microsoft/sharepoint" 启动向导，然后根据需要选择项目类型并提供项目信息。下一篇博客我们以webpart为例，了解项目的结构和文件。