前端模块化实践——seajs的使用

本文分享了一次从直接引用外部插件到利用seajs实现模块化加载的转变过程,详细介绍了文件结构优化、相对路径设置及seajs配置要点。通过实际案例,展示了如何在前端开发中有效管理资源,减少不必要的带宽消耗。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

      前段时间,一直在做前端的事,所以或多或少就会用到很多插件!由于我是一个比较懒得人所以我就想做一次下次就不用写了!所以插件很适合我,特别是jQuery 这货给我带来便利。这其中还用到很多朋友的插件感觉很方便,但终究不是按自己的使用习惯写的。用起来方便的时候 还是有点比别扭。所以我就尽量能自己封装的就自己封装的,不能自己封装的就用别人插件封装适合自己的使用习惯。在封装的过程中,我习惯把自己使用的js放到一个文件中,一个文件中有各种插件,一个css有各种插件需要使用的css。其实这样我也没感觉有什么不好,特别是你习惯了jQuery的情况下,你会发现把别人的插件能到自己的写的文件里,是那么简单,这样用起来就方便。

      一开始我就是这样做的!后面我又想了下,发现不行。这样我们这个页面就会加载很多根本没用到的插件和css。这样就会浪费带宽。我就想到了按需加载。我在网上查找了下资料,最后决定使用seajs 来实现自己的插件库。下午有时间就在github 上下了个seajs-2.1.1 ,并做了个测试!测试用例来源是http://blog.codinglabs.org/articles/modularized-javascript-with-seajs.html  这个博客写的很清楚怎么使用seajs。我测试用的例子也是用的上面的,这里谢博主了!!

    这个例子我是在 vs2010 上做的(用起来方便)!总的来说,还是碰到一些问题,在这说明下,以备,后面的人或自己以后使用。

    这是 我的文件结构

     

所遇到的问题。

   1.在 <script src="Scripts/sea/sea.js" id="seajsnode" data-main="./Scripts/src/init"  type="text/javascript"></script> 这句里的data-main=""初始化是不行的它不能代替use引进。

  2.其次就是各文件的相对路径问题。最好用这种("./")而不是这种("../")我自己测试的后面这种,是加载不进来的!

下面是针对上面的文件结构的调用!

 

 

 

 

 

表达能力有限!!各位看官莫怪!以后会慢慢好起来的!!

 

    

 

 

转载于:https://www.cnblogs.com/try-wyh/p/3322659.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值