angularjs + fis +modJS 对于支持amd规范的组建处理(PhotoSwipe 支持,百度webUpload支持)
这不是很好的处理方式,但是能够解决问题,希望有大神推荐更好的方式。
前端模块使用angularjs + fis +modJS 开发前端应用有两个月了。总结了以下的优点:
fis 自动构建,自动发布,功能非常方便
modJS 的require方式 类似写 nodejs ,写起来方便(后面才知道坑就在这里)
因为angular在模块化中做了很多事情,所以基于amd 的模块化其实很清淡,大部分是用来加载一些别人写的类库。
问题1: 解决PhotoSwipe 支持
1:导入PhotoSwipe就是放入libs 文件夹下,(你的不一定叫libs)
2: 封装成一个指令,便于使用其他地方使用。
3: require(photoSwipe);
4: 打开console,发现 PhotoSwipe is undefined ,为啥呢?
;(function (root, factory) {
if (typeof define === 'function' && define.amd) {
define(factory);
} else if (typeof exports === 'object') {
module.exports = factory();
} else {
root.PhotoSwipe = factory();
}
})(this, function () {
因为有这个头,官方声明为了兼容requirejs 的amd 方式,很多流行库中都有这么一段大同小异的代码,
然而 modJS 自动打包以后会自动添加
define('photoswipe', function(require, exports, module){}
导致无法实例化 PhotoSwipe
解决方式:
将this 改成 window ,同时 将 var PhotoSwipe = 改成 window.PhotoSwipe; 解决问题;
问题2: 百度上传插件;
同样的问题 WebUpload 无法初始化, 但是细心的你一定发现无法像上面那么添加window 修改,因为 里面已经写 window了
解决方式:
因为webUpload有自己的加载方式,用的是 require,而这个 require 跟 modJs 的 require 是冲突的,
将 require 修改为 _require
问题解决;
如开头所说,这不是理想的解决方式,甚至是不正确的方式,如有好的方法,麻烦留言告,感谢!
angularjs + fis +modJS 对于支持amd规范的组建处理(PhotoSwipe 支持,百度webUpload支持)的更多相关文章
- AMD规范学习笔记
背景 NodeJS的一套比较简洁 Moudles 规范, 使得在服务器端的模块化变得更加简单.很长一段时间,很多公司或者项目都有自己的一套模块化机制, 却未能形成一套统一的标准, NodeJS的Mou ...
- Javascript模块规范(CommonJS规范&&AMD规范)
Javascript模块化编程(AMD&CommonJS) 前端模块化开发的价值:https://github.com/seajs/seajs/issues/547 模块的写法 查看 AMD规 ...
- JavaSript模块规范 - AMD规范与CMD规范介绍
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...
- JavaSript模块规范 - AMD规范与CMD规范介绍(转)
JavaSript模块规范 - AMD规范与CMD规范介绍 JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者 ...
- JavaSript模块化-AMD规范与CMD规范
JavaScript模块化 在了解AMD,CMD规范前,先来简单地了解下什么是模块化,模块化开发. 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处 ...
- JavaSript模块规范 - AMD规范与CMD规范介绍 (转载lovenyf.blog.chinaunix.net)
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...
- JavaScript模块化---AMD规范
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问 题进行系 ...
- RequireJS和AMD规范
目录 概述 define方法:定义模块 require方法:调用模块 AMD模式小结 配置require.js:config方法 插件 优化器r.js 参考链接 概述 RequireJS是一个工具库, ...
- 【转】JavaSript模块规范 - AMD规范与CMD规范介绍
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...
随机推荐
- 发现两个有趣的CSS3效果
一.CSS3画机器猫 http://keleyi.com/keleyi/phtml/html5/3.htm 哆啦A梦效果图: 可用于浏览器对CSS3支持情况的测试 但最近有人对这个测试表示怀疑,指该测 ...
- CSS性能分析,如何优化CSS提高性能
不负十年后的自己,共勉! 前端性能优化一直是一个比较热门的话题,我们总是在尽我们最大的努力去,提高我们的页面性能,比如减少HTTP请求,利用工具对资源进行合并压缩,脚本置底,避免重复请求,css sp ...
- HTML5学习之 开发工具
Notepad++.Editplus 是常用的开发编辑器.这些在Window系统下,比较容易找到,但是在MAC系统下,有的是收费的,有的是不支持.我开发的时候,用的是TextWrangler,如图: ...
- AFNetworking 3.0 断点续传 使用记录
最近项目中用到了压缩包下载,使用AFNetworking 3.0 下载压缩包 支持断点续传 代码如下: #import "HDInternet_handler.h" #import ...
- 原生JS获取元素集合的子元素宽度
有些时候,在一个网页的ul li中,存在左右两个部分的内容,但是右边元素内容又是不固定,左边元素相对应的不能用固定宽度,所有需要我们动态的获取右边元素宽度,来赋值给左边元素的marginRight值. ...
- # iOS 10 适配 # 适配刷新控件 以MJRefresh 为例
在iOS10中ScrollView 添加了一个refreshControl的东西 - - 不知道水果公司做了什么 导致原有的刷新控件类刷新后frame.y 向下偏移了20 起初以为是水果调整了sta ...
- Object-C关于GCD多线程的使用
```objc1 使用Crearte函数创建的并发队列和全局并发队列的主要区别: 1)全局并发队列在整个应用程序中本身是默认存在的并且对应有高优先级.默认优先级.低优先级和后台优先级一共四个并发队列, ...
- ORACLE OLAP错误ORA-06512: at "SYS.OLAPIHISTORYRETENTION"
刚刚安装了ORACLE 10g R2后,启动数据库时发现告警日志有如下错误: Database Characterset is UTF8 replication_dependency_tracking ...
- Topshelf 创建windows服务注意事项
其中项目应该是控制台应用程序 test.exe需要赋与管理员权限,右键属性可以定义. test.exe install test.exe unstall
- x01.Weiqi.8: 一点改进
原来的代码全部删除,进行了深层次重构,得其意而忘其言.得意之处有二: 1.关于显示 以 StoneSize 属性为依托,在 set 中加了一句:Width = Height = m_StoneSize ...