//main.js 

requirejs.config({
    baseUrl: 'lib/js',//参照于引入这个js文件的index.html页面的相对路径,因为此时mian.js文件已经导入到了index.html中
    paths: {
        'jquery': 'jquery-1.8.3.min',//lib/js目录下的文件名,都是js可省略后缀.js
        'vue'   : 'vue',
        'Slide' : 'TouchSlide.1.1'
    }
});

//index.html
首先require.js与main.js文件的script标签引入，要放在body前面，在head标签中引用即可
第一种:用函数封装法
<head>
　　<script data-main="lib/main.js" src="lib/require.js"></script>
</head>
<body>
  <button onclick="cb_click()"></button>
</body>
<script>
    function cb_click() {
        require(['jquery', 'vue'], function ($, Vue) {
            $('body').css('background', 'blue');
            var add = {
                template: "<div>这就是一个用例</div>"
            }
            new Vue({
                el: '#app',
                data: function () {
                    return {
                        seller: {
                            type: Object
                        }
                    }
                },
                template: "<v-add></v-add>",
                components: {
                    'v-add': add
                }
            })
        })
    }
</script>

第二种与第三种：不是函数封装，直接require(['jquery', 'vue'], function ($, Vue) { })会造成同步加载不出，异步加载失败
  第二种: 把require(['jquery', 'vue'], function ($, Vue) { })放到main.js文件中，
　　　　　　 放到requirejs.config({ })方法的后面

  第三种：直接把<script data-main="lib/main.js" src="lib/require.js"></script>
            拆分成 <script src="lib/require.js"></script> 与
　　　　　　　　　　 <script src="lib/main.js"></script>
            然后就可以在index.html页面直接在其后面用require(['jquery', 'vue'], function ($, Vue) { })引入模块了




												


											
require.js使用baseUrl + paths导入文件配置的3种方法的更多相关文章
	

    
								
  1. [Django框架 - 静态文件配置、request对象方法初识、 pycharm链接数据库、ORM实操增删改查、django请求生命周期]
		
    [Django框架 - 静态文件配置.request对象方法初识. pycharm链接数据库.ORM实操增删改查.django请求生命周期] 我们将html文件默认都放在templates文件夹下 将 ...
    
		
    2. 
						
  2. 将Excel数据导入mysql数据库的几种方法
		
    将Excel数据导入mysql数据库的几种方法 “我的面试感悟”有奖征文大赛结果揭晓! 前几天需要将Excel表格中的数据导入到mysql数据库中,在网上查了半天,研究了半天,总结出以下几种方法,下面 ...
    
		
    3. 
						
  3. Android Studio导入Eclipse项目的两种方法
		
    Android Studio导入Eclipse项目有两种方法,一种是直接把Eclipse项目导入Android Studio,另一种是在Eclipse项目里面进行转换,然后再导入Android Stu ...
    
		
    4. 
						
  4. js和jquery给iframe src赋值的3种方法
		
    js和jquery给iframe src赋值的3种方法   网页使用iframe嵌入网页时,有时候需要动态处理src的值,而不是写死的,所以我们需要知道如何给iframe src赋值,通常是使用js或 ...
    
		
    5. 
						
  5. 总结java创建文件夹的4种方法及其优缺点-JAVA IO基础总结第三篇
		
    本文是Java IO总结系列篇的第3篇,前篇的访问地址如下: 总结java中创建并写文件的5种方式-JAVA IO基础总结第一篇 总结java从文件中读取数据的6种方法-JAVA IO基础总结第二篇  ...
    
		
    6. 
						
  6. 总结删除文件或文件夹的7种方法-JAVA IO基础总结第4篇
		
    本文是Java IO总结系列篇的第4篇,前篇的访问地址如下: 总结java中创建并写文件的5种方式-JAVA IO基础总结第一篇 总结java从文件中读取数据的6种方法-JAVA IO基础总结第二篇  ...
    
		
    7. 
						
  7. linux中快速清空文件内容的几种方法
		
    这篇文章主要介绍了linux中快速清空文件内容的几种方法,需要的朋友可以参考下 $ : > filename $ > filename $ echo "" > f ...
    
		
    8. 
						
  8. Linux清除文件内容的几种方法
		
    # 清空或删除大文件内容的五种方法: # 法一:通过重定向到 Null 来清空文件内容 $ >test.sh # 法二:使用 ‘true' 命令重定向来清空文件 $ true > test ...
    
		
    9. 
						
  9. linux清空文件内容的三种方法
		
    linux系统中清空文件内容的三种方法 1.使用vi/vim命令打开文件后,输入"%d"清空,后保存即可.但当文件内容较大时,处理较慢,命令如下:vim file_name:%d: ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. eclipse版本命名规则与其他软件命名
			
    文章:Eclipse各版本代号一览表 eclipse使用星球.神话人物.元素名称作为命名代号. 所以思路要放宽,不要拘泥于已有经验. java是用咖啡命名的: python中文意思是蟒蛇: 不拘泥于已 ...
    
			
    2. 
						
  2. lintcode-128-哈希函数
			
    128-哈希函数 在数据结构中,哈希函数是用来将一个字符串(或任何其他类型)转化为小于哈希表大小且大于等于零的整数.一个好的哈希函数可以尽可能少地产生冲突.一种广泛使用的哈希函数算法是使用数值33,假 ...
    
			
    3. 
						
  3. lintcode-49-字符大小写排序
			
    49-字符大小写排序 给定一个只包含字母的字符串,按照先小写字母后大写字母的顺序进行排序. 注意事项 小写字母或者大写字母他们之间不一定要保持在原始字符串中的相对位置. 样例 给出"abAc ...
    
			
    4. 
						
  4. PAT 1086 就不告诉你
			
    https://pintia.cn/problem-sets/994805260223102976/problems/1038429065476579328 做作业的时候,邻座的小盆友问你:“五乘以七 ...
    
			
    5. 
						
  5. c++ map 和 unordered_map的区别
			
    unordered_map和map类似,都是存储的key-value的值,可以通过key快速索引到value.不同的是unordered_map不会根据key的大小进行排序, 存储时是根据key的ha ...
    
			
    6. 
						
  6. Hibernate映射关系之_多对多
			
    多对多关系由于效率的原因,实际中会拆成相互的一对多的关系,不再累述
    
			
    7. 
						
  7. 【bzoj3856】Monster  乱搞
			
    题目描述 你要打一只h点血的怪物,每回合你攻击会造成a点伤害,回合结束后怪物会回b点血,你每攻击k回合需要休息一次,该回合不能造成伤害.怪物血量降到0以下就会死亡,问最后能否打死怪物. 输入 Ther ...
    
			
    8. 
						
  8. 【bzoj1878】[SDOI2009]HH的项链  树状数组
			
    题目描述 HH有一串由各种漂亮的贝壳组成的项链.HH相信不同的贝壳会带来好运,所以每次散步完后,他都会随意取出一段贝壳,思考它们所表达的含义.HH不断地收集新的贝壳,因此, 他的项链变得越来越长.有一 ...
    
			
    9. 
						
  9. 关于<meta http-equiv="Content-Type" content="text/html:charset=UTF-8">
			
    meta是html的元标签,其中包含了对应html的相关信息,客户端浏览器或服务端程序都会根据这些信息进行处理.我们以<meta http-equiv="Content-Type&qu ...
    
			
    10. 
						
  10. 【转】Win7装不上Office2010 提示MSXML 6.10.1129.0
			
    转自:http://zhidao.baidu.com/link?url=aZPbpBu0Fb7rc8HCb_NuonuZ4ET_BB8_NgZ96tCpB9dyuUyWVwMl78MLa7rh-rfx ...
    
			
    11.