博客地址:http://blog.csdn.net/FoxDave

SharePoint Framework包含一些客户端JavaScript库,你可以用来构建自己的解决方案。本文提供了你可以用来开发客户端web部件的工具和库的概述。

TypeScript

TypeScript是JavaScript的超类型,它以纯JavaScript编译。SharePoint客户端开发工具使用TypeScript类、模型和接口进行编译,你可以使用这些来构建强壮的客户端web部件。

开始使用TypeScript,使用以下的资源:

  • TypeScript Quick Start
  • TypeScript Playground
  • TypeScript Handbook
  • TypeScript community on Stack Overflow
  • JavaScript frameworks

    你可以使用任意的JavaScript框架来开发客户端web部件,下面是一些最受欢迎的:

  • React
  • AngularJS 1.x
  • Angular 2 for TypeScript 2.x
  • Handlebars
  • 由于客户端web部件是拖到SharePoint页面的组件,我们建议你选择支持类似组件模型的框架。轻量级的框架如React、Handlebars和Angular 2都支持组件模型,非常适合来构建客户端web部件。

    Node Package Manager(npm)

    SharePoint客户端开发工具使用npm包管理器来管理依赖项和其他JavaScript帮助类,跟NuGet类似,它常常作为Node.js的一部分。

    更多关于npm的信息,可以查看npm documentation

    Node.js

    Node.js是一个开源、跨平台的运行时环境,用来承载和服务JavaScript代码。你可以使用node.js开发服务端的JavaScript编写的web应用程序。Node.js生态环境跟npm和task runners紧密耦合,比如gulp提供了一个高效的用来构建基于JavaScript的应用程序的环境。Node.js跟IIS Express或IIS类似,但是包含了简化客户端开发的工具。

    更多关于Node.js的信息,看以下内容:

  • About Node.js
  • Node.js API reference documentation
  • Node.js Usage and Example
  • Gulp task runner

    SharePoint客户端开发工具使用gulp作为构建进程任务运行器来:

  • 打包和压缩JavaScript和CSS文件。
  • 在每次编译前运行工具去调用打包和压缩任务。
  • 把LESS或SASS文件编译成CSS。(LESS和SASS是CSS的两种扩展,类似的就是TypeScript之于JavaScript)
  • 把TypeScript文件编译成JavaScript。
  • 更多关于gulp的信息,看以下内容:

  • Getting started with Gulp
  • TypeScript and Gulp
  • Articles about Gulp
  • Webpack

    Webpack是一个模块打包工具,它把你的web部件文件打包为依赖项并生成一个或多个JavaScript包以便可以在不同的场景加载不同的包。

    开发工具链条使用CommonJS来打包。这使得你能够定义模块并选择在哪使用他们。工具链条还使用SystemJS来加载你的模块,它是一个通用的模块加载器。这帮助你确保你的每个web部件在各自的命名空间下执行。

    更多关于webpack的信息,看以下内容:

  • Webpack documentation
  • TypeScript, React, and Webpack
  • Yeoman generators

    Yeoman帮助你快速启动新的项目,提供最佳实践和工具来保证你的生产力。SharePoint Yeoman生成器将会作为快速新建客户端web部件项目的一部分提供给开发者。当项目被生成后,你可以使用你喜欢的IDE像Visual Studio或HTML/JavaScript代码编辑器像Visual Studio CodeSublime TextAtom

    更多关于Yeoman的信息,看以下内容:

  • Scaffold a web app with Yeoman
  • List of available Yeoman generators
  • 下面是一些你可以使用的常见的Yeoman生成器,取决于你选择的框架:

  • generator-react-webpack
  • generator-angular
  • SharePoint REST APIs

    SharePoint框架提供了SharePoint体验和目标web开发的关键集成。SharePoint REST APIs使你能够让SharePoint跟你的其他应用交互来构建你的web部件功能。

    我们推荐你熟悉以下的REST API集合:

  • SharePoint List REST APIs
  • Patterns and Practices

    Office Dev Patterns and Practices / SharePoint Pattern and Practices (PnP)提供了示例代码、模式和其他资源来帮助你将现有解决方案转换到SharePoint Framework。一定要去熟悉PnP上的示例代码和指引。

    SharePoint Framework 开发工具和库的更多相关文章

    1. APICloud支持Atom编辑器,并建立开发工具核心库

      APICloud支持Atom编辑器开发工具 APICloud始终坚持多开发工具支持策略,开发者无论使用Sublime Text3.Eclipse还是Webstorm,都可以在APICloud平台中找到 ...

    2. centos 通用开发工具及库安装 有了它不用愁了

      通用开发工具及库:# yum groupinstall "Development Tools" "Development Libraries"

    3. APICloud重磅支持Atom编辑器,并建立开发工具核心库

      APICloud技术再次升级,不仅支持Atom编辑器开发工具,并推出核心开发工具库,使开发者进行App开发更便捷高效. APICloud支持Atom编辑器开发工具 APICloud始终坚持多开发工具支 ...

    4. SharePoint 2016 开发 工具Preview发布

      博客地址:http://blog.csdn.net/FoxDave 之前装了SharePoint,但是并不能在Visual Studio 2015里面做开发,因为没有相应的office tool. 但 ...

    5. SharePoint Framework (SPFx)安装配置以及开发-基础篇

      前言 SharePoint Framework(SPFx),是页面 和Webpart的模型,完全支持本地开发(即完全可以脱离SharPoint环境在本地进行开发),SPFx包含了一系列的client- ...

    6. SharePoint 2013常用开发工具

      SharePoint 2013常用开发工具分享 2014-04-01 00:59 by jv9, 589 阅读, 1 评论, 收藏, 编辑 众所周知,一款好的开发工具不仅能提高项目开发效率,而且能够协 ...

    7. SharePoint Framework 配置你的SharePoint客户端web部件开发环境

      博客地址:http://blog.csdn.net/FoxDave 你可以使用Visual Studio或者是你自己的开发环境来构建SharePoint客户端web部件.你可以使用Mac.PC或是 ...

    8. SharePoint Framework:下一代开发方式

      SharePoint Framework(SPFx),是页面 和Webpart的模型,完全支持本地开发(即完全可以脱离SharPoint环境在本地进行开发),听起来是不是很高级呢,早期SharePoi ...

    9. SharePoint Framework 构建你的第一个web部件(一)

      博客地址:http://blog.csdn.net/FoxDave SharePoint客户端web部件是出现在SharePoint页面的控件,但却是在浏览器本地运行的.他们是SharePoint ...

    随机推荐

    1. 《CSS权威指南》读书笔记

      一.css和文档层叠 css规定了冲突规则,这些规则统称为层叠.这些规则定义了样式发生冲突时以优先级高的为准. 常用的优先级判定: 1. 开发者样式>读者样式>浏览器样式(除非使用!imp ...

    2. springcloud(第三篇)springcloud eureka 服务注册与发现 *****

      http://blog.csdn.net/liaokailin/article/details/51314001 ******************************************* ...

    3. meta 360极速模式

      <meta name="render" content="webkit">  启用360极速模式

    4. CSS的一些小技巧

      1.黑白图像img.desaturate { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: graysc ...

    5. MVC5 Entity Framework学习之Entity Framework高级功能(转)

      在之前的文章中,你已经学习了如何实现每个层次结构一个表继承.本节中你将学习使用Entity Framework Code First来开发ASP.NET web应用程序时可以利用的高级功能. 在本节中 ...

    6. MVC5+EF6 入门完整教程十一:细说MVC中仓储模式的应用

      摘要: 第一阶段1~10篇已经覆盖了MVC开发必要的基本知识. 第二阶段11-20篇将会侧重于专题的讲解,一篇文章解决一个实际问题. 根据园友的反馈, 本篇文章将会先对呼声最高的仓储模式进行讲解. 文 ...

    7. Bootstrap 表单

      表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式.下面列 ...

    8. guava学习--Preconditions

      转载:https://my.oschina.net/realfighter/blog/349819 Preconditions是guava提供的用于进行代码校验的工具类,其中提供了许多重要的静态校验方 ...

    9. 通过JS检测360浏览器

      如何通过JS检测360浏览器? 尝试了一大堆方法,网上大多数办法都是通过navigator.userAgent来判断,这可能在几年前是行得通的,现在360userAgent输出来跟谷歌除了版本号其余一 ...

    10. PHP发送电子邮件

      1.导入文件,如本案例把Stmp.class.php放到Common\Common目录下,代码很多,直接复制就行! <?php namespace Common\Common; class Sm ...