require.js使用baseUrl + paths导入文件配置的3种方法
//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种方法的更多相关文章
- [Django框架 - 静态文件配置、request对象方法初识、 pycharm链接数据库、ORM实操增删改查、django请求生命周期]
[Django框架 - 静态文件配置.request对象方法初识. pycharm链接数据库.ORM实操增删改查.django请求生命周期] 我们将html文件默认都放在templates文件夹下 将 ...
- 将Excel数据导入mysql数据库的几种方法
将Excel数据导入mysql数据库的几种方法 “我的面试感悟”有奖征文大赛结果揭晓! 前几天需要将Excel表格中的数据导入到mysql数据库中,在网上查了半天,研究了半天,总结出以下几种方法,下面 ...
- Android Studio导入Eclipse项目的两种方法
Android Studio导入Eclipse项目有两种方法,一种是直接把Eclipse项目导入Android Studio,另一种是在Eclipse项目里面进行转换,然后再导入Android Stu ...
- js和jquery给iframe src赋值的3种方法
js和jquery给iframe src赋值的3种方法 网页使用iframe嵌入网页时,有时候需要动态处理src的值,而不是写死的,所以我们需要知道如何给iframe src赋值,通常是使用js或 ...
- 总结java创建文件夹的4种方法及其优缺点-JAVA IO基础总结第三篇
本文是Java IO总结系列篇的第3篇,前篇的访问地址如下: 总结java中创建并写文件的5种方式-JAVA IO基础总结第一篇 总结java从文件中读取数据的6种方法-JAVA IO基础总结第二篇 ...
- 总结删除文件或文件夹的7种方法-JAVA IO基础总结第4篇
本文是Java IO总结系列篇的第4篇,前篇的访问地址如下: 总结java中创建并写文件的5种方式-JAVA IO基础总结第一篇 总结java从文件中读取数据的6种方法-JAVA IO基础总结第二篇 ...
- linux中快速清空文件内容的几种方法
这篇文章主要介绍了linux中快速清空文件内容的几种方法,需要的朋友可以参考下 $ : > filename $ > filename $ echo "" > f ...
- Linux清除文件内容的几种方法
# 清空或删除大文件内容的五种方法: # 法一:通过重定向到 Null 来清空文件内容 $ >test.sh # 法二:使用 ‘true' 命令重定向来清空文件 $ true > test ...
- linux清空文件内容的三种方法
linux系统中清空文件内容的三种方法 1.使用vi/vim命令打开文件后,输入"%d"清空,后保存即可.但当文件内容较大时,处理较慢,命令如下:vim file_name:%d: ...
随机推荐
- js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)
原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...
- mingw编译opencv2.4.13问题记录
为了在程序中用regex,升级了我的mingw,结果官网上的GCC版本都到6.3了,之前一直用4.8.换了编译器以后,对opencv2.4.10的引用就出了问题:undefined reference ...
- python之*args和**kwargs参数,以及迭代器
*args让函数可以接受不限制多个位置参数,**kwargs让函数可以接受不限制多个关键字参数,用法如图 2.迭代器总结
- 完整Android开发基础入门博客专栏
博客地址:http://www.runoob.com/w3cnote/android-tutorial-contents.html
- ES索引
Elasticsearch索引别名.Filtered索引别名.Template 在使用elasticsearch的时候,经常会遇到需要淘汰掉历史数据的场景. 为了方便数据淘汰,并使得数据管理更加灵活, ...
- 【BZOJ 2957】楼房重建&&Codechef COT5 Count on a Treap&&【NOIP模拟赛】Weed 线段树的分治维护
线段树是一种作用于静态区间上的数据结构,可以高效查询连续区间和单点,类似于一种静态的分治.他最迷人的地方在于“lazy标记”,对于lazy标记一般随我们从父区间进入子区间而下传,最终给到叶子节点,但还 ...
- git clone 出错 fatal: pack has bad object at offset 26060927: inflate returned -3
$ git clone http://xxx.xxx.cn/liyafei/developer.gitCloning into 'developer'...remote: Counting objec ...
- SICAU-OJ:要我唱几首歌才能够将你捕捉
要我唱几首歌才能够将你捕捉 题意: 有N种颜色的牛,现在可以执行以下两种操作: 1.抓捕一只牛,代价为ai: 2.花费x的代价使用魔法,让所有颜色加1,N会变为1. 求得到N种颜色的牛最少花费的代价. ...
- poj 2104 (主席树写法)
//求第K的的值 1 #include<stdio.h> #include<iostream> #include<algorithm> #include<cs ...
- wyh的天鹅~vector的使用
链接:https://www.nowcoder.com/acm/contest/93/L来源:牛客网 时间限制:C/C++ 3秒,其他语言6秒 空间限制:C/C++ 262144K,其他语言52428 ...