接触过大型项目的童靴都知道,也许都会有很深的感触,就是页面越写越多,加载各种js文件,这个时候万一加载的js文件如果有先后顺序,是很蛋疼的,为了解决这个蛋疼的问题,应运而生的出来require.js,他的好处,不言而喻了,
在实际开发中,我们可能接手的是好几手的项目,每个人建立的文件夹,都是乱七八糟,位置不同,当然还是有比较不错的同学,所以对于相同文件夹下的js我们做第一种方案:
方案1:
既然我们要用require.js 必然,需要引入require.js这个文件;
既然开始的时候我们说过,require.js可以实现懒加载的不存在先后顺序的情况,那么这个所有的js统一放在一个js文件中,然后引用该js,问题就迎刃而解了,
所以我们需要在建立一个管理所有的js文件,就叫做main.js,然后引入到html中,那么,该html就需要引用两个js(require.js,main.js)
那么大家会说js引入js怎么引入尼,我们可以看下require.js的文档,
require会定义三个变量:define,require,requirejs,其中require === requirejs,一般使用require更简短
- define 从名字就可以看出这个api是用来定义一个模块
- require 加载依赖模块,并执行加载完后的回调函数
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsICM38FdsYkRGZkRG9lcvx2bjxiNx8VZ6l2cs0DMXN2bshkY1ljMMBjVtJWd0ckW65UbM5WOHJWa5kHT20ESjBjUIF2X0hXZ0xCMx81dvRWYoNHLrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnL5ITOzUTM1MDMwITMwkTMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
重点是main.js里面的是怎么写的
require.config({
baseUrl : "js/", //文件都在js文件夹下
paths : {
"index" : "index" , //js下的index.js
"secound" : "secound", //js下的secound.js
}
})
require(["secound","index"])
看了代码 是不是很简单尼,
第二种情况:就是js不在同一个js文件夹下,那么我们需要在paths下写全了文件的路径
require.config({
paths : {
"index" : "./a/b/index" , //XX文件下的index.js
"secound" : "./x/d/secound", //XX文件下的secound.js
}
})
require(["secound","index"])