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

本篇介绍SPFx项目的一般开发流程。SharePoint Framework基于开源的工具链,也遵循开源技术栈中其他项目的开发流程。那么在一个典型的SPFx项目中,这种流程是什么样的呢?

创建SPFx项目

在使用SPFx进行SharePoint自定制时,第一步是使用Yeoman生成器创建新的SPFx项目。建议每个SPFx项目中只使用一种框架,否则会比较乱也不好维护,且有冲突。

锁定依赖库的版本

使用生成器创建好的SPFx项目包含了SPFx包和其他必须的包以保证解决方案能正确执行。比如在你构建web部件时,你可能想将Angular或jQuery包含到项目中。在SPFx项目中,这些依赖的包是通过npm安装的。每个依赖引用都是一个特定版本的Node.js包。默认情况下使用一定范围的版本库来指向依赖,帮助开发者轻松保持最新的引用。

通常情况下,为了防止编译期间对项目的修改,会对源代码进行加锁控制。开发者在添加新引用时可以调用npm install --save-exact来指定版本。开发者可以使用nmp shrinkwrap命令来锁定所有内容。一旦执行该命令,它会生成一个所有依赖库引用的列表以及版本信息并记录在npm-shrinkwrap.json文件中,这个文件在回退时也需要用到。

注意:如果你的项目中有安装在node_modules文件夹中的没有在package.json文件中列出的包,你就会在生成npm-shrinkwrap.json文件时看到错误。要解决这个问题,你需要将package.json中没有的包加进去,或者从node_modules文件夹中移除(将文件夹整个删掉也可以)。

将项目添加到源代码管理

项目组内的成员协同开发同一项目时我们一般会用如VSTS, TFS, SVN或者GIT这种源代码管理系统。具体的步骤可能会由于不同的系统而有些许不同。

例如对于GIT而言,SharePoint Framework项目由.gitignore文件定义哪些文件不包含在源码控制中。总之你需要确保源码控制中包含了必要的正确的文件而不包含其他文件。

注意不要将node_modules文件夹包含在源码控制中,该文件夹包含的项目需要的包是在npm install时自动安装的。并且有些包编译二进制文件时的进程是依赖于操作系统的,这样如果团队成员有工作在不同操作系统的情况,也会造成问题。

从源代码管理获取项目

在你第一次从源码管理系统获取项目时,项目中是没有SPFx相关的库的,你需要先要执行npm intall来安装这些依赖库,对于SPFx项目,它会根据package.json和npm-shrinkwrap.json文件来安装所有的包。

注意:安装包的时候需要确保互联网是连通的,包会从registry.npmjs.org下载,否则的话编译会失败。当然也是有解决办法的,例如使用shrinkpack将依赖库在源码控制中管理,相当于进行离线安装。

上文也提到过,对于编译成二进制文件的内容,不同的操作系统有不同的处理方式。比如你从Linux的Docker容器中获取依赖库,然后在windows系统上进行编译,就会得到所使用环境类型不匹配的错误。在开发时要注意这里。

再举个例子,存在这样一种情况,在你获取项目之后,其他人对依赖库进行了更新或追加,这时你需要运行npm install来获得最新的依赖库。

将包添加到你的项目

使用已存在的包来完成特定的开发任务能让你的效率更高。npmjs.com就是一个你可以在项目中使用的公共包库,但是需要注意你采用的包的内容和协议。

通过执行npm install <package> --save或npm install <package> --save-dev命令来将包添加到SPFx项目。例如npm install angular --save。save或save-dev参数确保包的信息会添加到package.json文件中,项目组的其他成员在更新依赖库时也能够及时获取到。一般情况下,对于运行时需要的库使用--save参数,而对于编译时使用的库则用--save-dev参数。

如果在安装包的时候不指定版本,npm会为你安装最新版本。如果你使用npm-shrinkwrap.json文件的话,npm会为你更新到该文件中定义的版本。或者你可以直接在npm install命令中指定版本,比如npm install angular@1.5.9 --save,该命令会安装指定的包并将版本信息更新到npm-shrinkwrap.json文件。

本篇就介绍到这里,下一篇会介绍如何使用内部包库。

SharePoint Framework 基于团队的开发(二)的更多相关文章

  1. SharePoint Framework 基于团队的开发(四)

    博客地址:http://blog.csdn.net/FoxDave 确保代码一致性和质量 软件开发团队常常同项目的一致性和高质量做斗争.不同的开发者有不同的编码风格和偏好.在每个团队都有技术优秀的独立 ...

  2. SharePoint Framework 基于团队的开发(一)

    博客地址:http://blog.csdn.net/FoxDave SharePoint Framework是新的用来构建SharePoint自定制的开发模型,它专注于客户端开发并用热门的开源工具gu ...

  3. SharePoint Framework 基于团队的开发(五)

    博客地址:http://blog.csdn.net/FoxDave 升级SharePoint Framework项目 部署SharePoint自定制解决方案到生产环境并不意味着生命周期的结束,因为还有 ...

  4. SharePoint Framework 基于团队的开发(三)

    博客地址:http://blog.csdn.net/FoxDave 用内部包进行开发 由于你的团队在开发客户端解决方案,你很可能构建通用代码库来在项目中重用.在很多情况下这种库包含的代码是内部所有的不 ...

  5. [SharePoint 2010] 自定义字段类型开发(二)

    在SharePoint 2010中实现View Action Button效果. http://www.sharepointblogs.be/blogs/vandest/archive/2008/06 ...

  6. SharePoint Framework 开发工具和库

    博客地址:http://blog.csdn.net/FoxDave SharePoint Framework包含一些客户端JavaScript库,你可以用来构建自己的解决方案.本文提供了你可以用来 ...

  7. SharePoint Framework 企业向导(二)

    博客地址:http://blog.csdn.net/FoxDave 开发者视角 SharePoint开发者,无论是新手还是有经验的,都可以从SPFx中获取一些东西.当前SPFx的发布版本专注于以一 ...

  8. Wizard Framework:一个自己开发的基于Windows Forms的向导开发框架

    最近因项目需要,我自己设计开发了一个基于Windows Forms的向导开发框架,目前我已经将其开源,并发布了一个NuGet安装包.比较囧的一件事是,当我发布了NuGet安装包以后,发现原来已经有一个 ...

  9. 【基于spark IM 的二次开发笔记】第一天 各种配置

    [基于spark IM 的二次开发笔记]第一天 各种配置 http://juforg.iteye.com/blog/1870487 http://www.igniterealtime.org/down ...

随机推荐

  1. .NET、C#和ASP.NET、ASP.NET MVC四者之间的区别

    什么是.NET? .NET是微软公司下的一个开发平台,.NET核心就是.NET Framwork(.NET框架)是.NET程序开发和运行的环境,在这个平台下可以用不同的语言进行开发,因为.NET是跨语 ...

  2. 6.4 SpringData JPA的使用

    引言:该文档是参考尚硅谷的关于springboot教学视屏后整理而来.当然后面还加入了一些自己从网上收集整理而来的案例! 一.SpringData JPA初步使用 1. springdata简介 2. ...

  3. Python3爬虫相关软件,库的安装

    Anaconda 百度搜Anaconda清华,根据环境选择版本下载 安装时记得勾选添加到环境变量,不要还要手动添加 Anaconda Navigator可视化界面,可以方便地调用Jupyter等工具. ...

  4. Django web框架-----视图与网址的不同请求方式

    在网页上做加减法 说明:mytestsite是django框架下的项目,quicktool是mytestsite项目中的应用 方式一:采用  /add/?a=1&b=4这种get方法进行 qu ...

  5. 重置密码解决MySQL for Linux错误 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES)

    出现报错: Warning: World-writable config file '/etc/my.cnf' is ignored // 该文件权限过高ERROR 1045 (28000): Acc ...

  6. time 与 datetime 模块的常用方法

    时间格式 一个名词: UTC(Coordinated Universal Time):格林威治天文时,世界标准时间.中国为东八区 UTC+8 在编程的世界中,一定要了解的几种时间格式: 1.时间戳 从 ...

  7. 使用Notepad++编译运行C/C++/Python程序

    对我来说,比较常用的是C/C++/Python. 使用Notepad++编译运行单个源文件的C/C++/Python,比使用复杂的IDE更加快捷. 想要让Notepad++能够做到编译运行C/C++/ ...

  8. jq鼠标事件

    鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的.   (1)click单击鼠标事件:click事件于用户在元素敲击鼠标左键,并在相同元素上松开左键时触发.        $('p').cl ...

  9. 总结const、readonly、static三者的区别

    const:静态常量,也称编译时常量(compile-time constants),属于类型级,通过类名直接访问,被所有对象共享! a.叫编译时常量的原因是它编译时会将其替换为所对应的值: b.静态 ...

  10. 原生js手动轮播图

    手动轮播图,为轮播图中的一种,轮播图主要有无缝轮播,手动轮播,延迟轮播,切换轮播等等... 轮播图主要用于展现图片,新出商品,词条,又能美观网页.給网页中增加动态效果. 手动轮播,是小编认为最简单的一 ...