SharePoint Framework系列(四)-安装开发环境

你可以使用Visual Studio或者你自己的开发环境来开发SharePoint client-side web parts。你可以使用Mac或者Linux环境。在进行下面操作之前,请确保你已经配置好了Office 365的环境。

安装开发工具

  • NodeJS

安装装NodeJS(LTS) v4.x.x 版本

  1. 如果你已经安装了NodeJS,确保已经安装了最新版本。使用node -v 会返回LTS的版本信息。
  2. 如果你使用的是Mac,建议你使用homebrew 进行安装和管理NodeJS。
安装完Node之后,请确使用如下命令安装npm V3版本

npm -g install npm@3
如果是Linux Ubuntu系统可能可能会返回Permission denied的错误,可以使用如下命令安装

sudo npm -g install npm@3

  • 代码编辑工具

安装代码编辑器,你可以使用任何code编辑器或者支持client-side开发的IDE来开发web part,例如:

  1. Visual Studio Code
  2. Sublime
  3. Atom
  4. Webstorm

一下和后续的介绍都将采用Visual Studio Code作为IDE进行讲解

  •   如果你使用PC开发

你需要安装window-build-tools,这个tool会安装Visual C++ Build Tools 2015,这个tool是微软免费的,这些工具会用来编译本地的module。同时还会安装Python 2.7,配置本地的机器和npm。

运行如下命令进行安装

npm install --global --production windows-build-tools


  •   如果你使用Visual Studio

如果你想要使用Visual Studio作为你的开发工具,需要安装如下工具和更新

  1. Visual Studio 2015
  2. Visual Studio Update 3 或者后续版本
  3. Node.js Tools For Visual Studio

  • 如果你使用的Ubuntu

你需要使用如下命令安装编译工具

sudo apt-get install build-essential

  • 如果你使用的fedora

你需要使用如下命令安装编译工具

sudo yum install make automake gcc gcc-c++ kernel-devel

  • 安装Yeoman和Gulp

Yeoman用于创建新的工程,并且提供了示例和工具用于帮助你保持生产力,SharePoint client-side开发工具包含了一个Yeoman生成工具,用于创建新的webpart。这个生成工具包含了:打包工具,公共的模板代码和一个用于host web part的站点。

使用如下命令可以安装Yeoman和gulp

npm i -g yo gulp

  • 安装Yeoman SharePoint generator

Yeoman SharePoint web part generator帮助你快速创建带有正确的toolchain和结构的的SharePoint client-side solution工程,使用如下命令安装Yeoman SharePoint Generator:

npm i -g @microsoft/generator-sharepoint

  • 其它可选工具

  1. Fiddler
  2. Postman plugin for Chrome
  3. Cmder for Windows
  4. Oh My Xsh for Mac
  5. Git source control tools

注意:SharePoint Framework目前正处于Preview阶段,随时会进行一些更改。SharePoint Framework Client-side web parts在Office 365的生产环境中暂时不支持。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值