//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. Hessian 2.0 序列化协议 - Hessian 2.0 Serialization Protocol 翻译
			
    Hessian是一种轻量.快速的web协议,在微服务场景下经常被使用. Hessian协议实际上包含两种含义: 1. Web网络通信远程调用服务,具体可以参考:http://hessian.cauch ...
    
			
    2. 
						
  2. 第16讲——C++中的代码重用
			
    C++的一个主要目标是促进代码重用.除了我们之前学的公有继承,我们在这一讲将介绍另一种代码重用的方法——类模板.
    
			
    3. 
						
  3. NO9——线段相关
			
    #include <stdio.h> #include <iostream> #include <math.h> #include <algorithm> ...
    
			
    4. 
						
  4. Week8 Teamework from Z.XML-Z.XML游戏功能说明
			
    我们小组的游戏终于新鲜出炉了,好开心~ 快来看看有什么功能吧. 游戏目标::=打倒最多的敌人,获得积分,放松心情,获取快乐. 游戏菜单::= 关于+设置+帮助+积分榜+开始游戏吧 (截图还在路上..) ...
    
			
    5. 
						
  5. 团队作业4——第一次项目冲刺（Alpha版本)-第二篇
			
    项目冲刺——第二阶段 度过了敏捷冲刺,各个成员积极汇报各自的工作.好了,着手下一步规划! Mission 团队成员 任务 郭达  实现PHP后台的答题判分查看正确率 刘德培  编写博客 石浩洋  实现 ...
    
			
    6. 
						
  6. Redis能做什么？不能做什么？
			
    https://blog.csdn.net/u014229282/article/details/81174202 最近阅读了<redis设计与实现>,这是一本比较枯燥的书,毕竟涉及到re ...
    
			
    7. 
						
  7. js+jquery 常用选择器函数
			
    一.获取当前标签 JS: this,如下: <button onclick="fun(this)"></button> Jquery,如下: $(" ...
    
			
    8. 
						
  8. BZOJ1143  [CTSC2008]祭祀river  【二分图匹配】
			
    1143: [CTSC2008]祭祀river Time Limit: 10 Sec  Memory Limit: 162 MB Submit: 3236  Solved: 1651 [Submit] ...
    
			
    9. 
						
  9. JavaScript的大括号的语义
			
    Javascript中大括号"{}"有四种语义作用: 语义1. 组织复合语句,这是最常见的: view source   print? 1 if( condition ) { 2  ...
    
			
    10. 
						
  10. Pycharm 创建 Django admin 用户名和密码
			
    1.  问题 使用PyCharm  创建完Django 项目  想登录admin  页面   却不知道用户名和密码. 用的默认sqlit   2.解决办法   2.1 打开manage.py 控制界面 ...
    
			
    11.