seajs使用小结(一)

前端模块化管理工具seajs已经广泛使用在国内前端开发中,我也算在好几个项目中使用了几次,从1.3.1~3.0.0也碰到了一些问题,现在想就主要的两种使用方式进行总结,也就使用中的问题给出一些解决方案。

首先,我们来看看常用的两种seajs使用方式,一种是使用seajs.use直接将js模块引入进来,另一种是先用<script>标签先将js引入进来,再由seajs.use引用(需要有id):

比如:对以下目录结构

seajs-test

|-----js

|----- |-----a.js

|-----seajs-3.0.0.js

|-----seajs-test.html

可以采用如下方式对a.js进行加载:

a.js如下:

define('a.id', function() {
    console.log('i am a.js');
    return {
        hello: function() {
            console.log('a.js says hello!');
        }
    }
});

    <!-- 第一种方式 -->
    <script>
        seajs.use('./js/a.js', function(p) {
            p.hello();
        })
    </script>

    <!-- 第二种方式 -->
    <script src="./js/a.js"></script>
    <script>
        seajs.use('a.id', function (p) {
            p.hello();
        });
    </script>


以上两种方式都可以将a.js中定义的模块引入页面,在实践中,发现,虽然这两种方式功能一样,但是在具体运行中还是有一些不同,私下里总结了这两种方法的几个优缺点。

方式一优点:

1、简单方便

2、代码量少,可以减少script的数量

缺点:

1、当文件地址变更的时候,相对路径和绝对路径的方式不好进行修改

2、将项目所有js文件都压缩合并后,难以加载。


方法二优点:

1、可以利用script标签管理js文件的加载

2、利于script文件的压缩合并,压缩后依然可以通过id加载

缺点:

1、需要给每一个配置文件都加上id

2、代码量较多


个人还是比较喜欢第二种方法,因为现在对代码进行合并压缩对于较大型的网站都是标配,另外对模块加上id的工作也可以通过自动化工具按照规则来生成,不会占用太多工作量。

而具体怎么使用seajs批量加载文件,将在seajs使用小结(二)中进行讨论

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值