首页 > 开发一个前后端都可用的JS工具插件(符合CommonJS和AMD),其中带有可选依赖,怎么设计引入依赖的机制?

开发一个前后端都可用的JS工具插件(符合CommonJS和AMD),其中带有可选依赖,怎么设计引入依赖的机制?

例如我有一个计算类的工具插件myPlugin,主逻辑已经开发完成,并封装在匿名函数中。现在我给他加上了CommonJS 和 RequireJS 的支持如下:

javascript(function(factory){
    //判断客户端还是服务端
    var isWindow = ( typeof window !== 'undefined' ? true : false );
    var global = ( isWindow ? window : this );

    if (typeof module !== 'undefined' && module.exports) {
        module.exports = factory();
    }
    // AMD RequireJS
    else if (typeof define !== 'undefined' && define.amd) {
        define('myPlugin', [], factory() );
    }
    else if(isWindow){
        window.myPlugin = factory();
    }
})(function(global){

        /*
         * myPlugin 代码
         */
        return _myPlugin();
});

目前看来很舒服。但是现在插件中增加了一个可选功能,由于功能中需要的代码比较庞大,为了缩减文件大小,需要引入另外一个工具库myUtil提供的方法提供支持。
因此加入的逻辑为:判断如果项目中引入了(或"可引入")这个myUtil库,则引入myUtil支持这个功能。如果没有引入则不提供这个功能。即"非强制性"的可选依赖。

在简单的情况下可能是这样的逻辑:
nodejs

javascript
try{ var util = require('path/to/myUtil'); }catch(e){ ; } if( util ){ //... }else{ //... }

可是如果将这段代码放入myPlugin中,则myUtil的path/to怎么去管理?
或者是提示想用的人手动把myUtil require()出来暴露到global里?按习惯来说一般应该不会这么做吧。

另外在AMD, define( ['myUtil'],factory() )从一开始就默认引入myUtil了。除非去掉支持,脚本只提供factory,把这个交给用的人自己去写,可是这样就不满足封装的初衷了。

浏览器纯<script>引入倒是好操作,直接判断if( typeof window.myUtil !== 'undefined' )就行了。

其实就类似前端脚本判断是否有(或提供了)jQuery,如果有则加上$.fn支持的过程,现在就是在考虑不同情况下怎么去写,封装的才合理,并且在几种情况下都显得比较合适?


Universal Module Define
https://github.com/umdjs/umd
这里有很多例子可以参考

一般来说用returnExport那个就行了

【热门文章】
【热门文章】