首先,工程目录:

现在主页面(web框架写法.html):

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>requirejs的使用</title>
<!-- 属性 data-main 是告诉requirejs:你下载完以后,马上去载入真正的入口文件 -->
<script src="https://cdn.bootcss.com/require.js/2.3.5/require.min.js" data-main="js/config.js"></script>
</head> <body>
<div class="box" v-cloak>
内容一:<span v-text="other"></span>
</div>
<br />
<div class="box2">
内容二:<span id="other2"></span>
</div>
</body>
<script>
/**
* 载入程序主模块
* 这里不写JS代码(建议)
*/
require(['../js/indexController']);
</script> </html>

接下来是 config.js

/**
* 配置requirejs 比如项目中用到哪些模块,文件路径是什么
* 在使用requirejs时,加载模块时不用写.js后缀的,当然也是不能写后缀
* urlArgs的作用是清楚缓存
* paths中使用两个是多路径解析,当第一个加载不成功或者加载出现问题会放弃第一个自动加载第二个(可以配置一大堆)
* shim是将某个依赖中的某个全局变量暴露给requirejs,当作这个模块本身的引用
*/
requirejs.config({
baseUrl: './',
urlArgs: 'v=' + (new Date()).getTime(),
paths: {
'jquery': ['https://google-api.ac.cn/cdn/jquery/3.3.1/jquery.min', 'https://cdn.bootcss.com/jquery/3.3.1/jquery.min'],
'vue': ['https://google-api.ac.cn/cdn/vue/2.5.16/vue.min', 'https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min']
},
shim: { }
});

最后是 indexController.js

/**
* 这里是config载入的程序主模块的内容
* 可以加入多个主模块(建议)
*/
define(['vue','jquery'], function(vm) {
new vm({
el: '.box',
data: {
other: 'HelloWorld',
}
});
$("#other2").html("HelloChina");
});

-----------------------------------------------------------------------------------------------------------------------------------

很简单的例子,直接复制粘贴修修改改就可以使用,代码也少。

喜欢的人拿去用吧,大牛勿喷

脱离node自己使用普通的requirejs管理js资源的更多相关文章

  1. 最新Node.js 资源汇总

    Node.js 资源汇总 文档 Node.js 官方文档:http://nodejs.org/api/ Node.js 中文文档:http://nodejs.jsbin.cn/api/ Express ...

  2. Orchard官方文档翻译(九) 新增并管理媒体资源

    原文地址:http://docs.orchardproject.net/Documentation/Adding-and-managing-media-content 想要查看文档目录请用力点击这里 ...

  3. NanUI文档 - 打包并使用内嵌式的HTML/CSS/JS资源

    NanUI文档目录 NanUI简介 开始使用NanUI 打包并使用内嵌式的HTML/CSS/JS资源 使用网页来设计整个窗口 如何实现C#与Javascript相互掉用(待更新...) 如何处理Nan ...

  4. 在IIS上新发布的网站,样式与js资源文件加载不到(资源文件和网页同一个域名下)

    在IIS上新发布的网站,网站能打开,但样式与js资源文件加载不到(资源文件和网页是同一个域名下,例如:网页www.xxx.com/index.aspx,图片www.xxx.com/pic.png). ...

  5. Jenkins管理静态资源

    这里我们的前端是使用webpack来管理静态资源的,把静态资源上传到svn上面来管理 这里我们把项目和静态资源剥离开来,然后静态资源接入CDN 我们的svn的结构是这样的 我们需要把这些目录都进行打包 ...

  6. 微擎JS资源请求 403

    微擎JS资源请求 403 1.确认JS是否指定 type ==> text/javascript 2.确认src的路径是否正确,{MODULE_URL}项目的根目录带反斜杠 3.实例:(PS:t ...

  7. 用 cgroups 管理 cpu 资源

    转自:http://xiezhenye.com/2013/10/用-cgroups-管理-cpu-资源.html 这回说说怎样通过 cgroups 来管理 cpu 资源.先说控制进程的 cpu 使用. ...

  8. k8s管理存储资源

    1. Kubernetes 如何管理存储资源 理解volume 首先我们学习 Volume,以及 Kubernetes 如何通过 Volume 为集群中的容器提供存储:然后我们会实践几种常用的 Vol ...

  9. k8s管理pod资源对象(上)

    一.容器于pod资源对象 现代的容器技术被设计用来运行单个进程时,该进程在容器中pid名称空间中的进程号为1,可直接接收并处理信号,于是,在此进程终止时,容器即终止退出.若要在一个容器中运行多个进程, ...

随机推荐

  1. Activity、Fragment、ViewPage

    1.新建super //super提供统一的FragmentActivity入口.public abstract class SuperFragmentActivity extends Fragmen ...

  2. Nosql的实际应用场景

    怎么样把NoSQL引入到我们的系统架构设计中,需要根据我们系统的业务场景来分析,什么样类型的数据适合存储在NoSQL数据库中,什么样类型的数据必须使用关系数据库存储.明确引入的NoSQL数据库带给系统 ...

  3. USACO Sabotage, 2014 Mar 破坏阴谋(二分+贪心)

    一开始看完这题就有个想法: 只要把大于整个序列平均数的最大连续序列就是最优? 那把整个序列都减掉平均数 在做最大连续字序列和且记录长度? 仔细思考一下并不太对: 当子序列最大但长度较大 也许也比不上删 ...

  4. javascript中常用数组方法详细讲解

    javascript中数组常用方法总结 1.join()方法: Array.join()方法将数组中所以元素都转化为字符串链接在一起,返回最后生成的字符串.也可以指定可选的字符串在生成的字符串中来分隔 ...

  5. 12 个最佳 GNOME(GTK)主题

    作者: Phillip Prado 译者: LCTT 郑 | 2019-04-14 09:45   评论: 1 收藏: 2 让我们来看一些漂亮的 GTK 主题,你不仅可以用在 Ubuntu 上,也可以 ...

  6. java的插入排序

    import java.util.Scanner;public class test22 { public static void main(String[] args) {  Scanner in= ...

  7. [NOIP补坑计划]NOIP2016 题解&做题心得

    感觉16年好难啊QAQ,两天的T2T3是不是都放反了啊…… 场上预计得分:100+80+100+100+65+100=545(省一分数线280) ps:loj没有部分分,部分分见洛咕 题解: D1T1 ...

  8. [luogu2059 JLOI2013] 卡牌游戏 (概率dp)

    题目描述 N个人坐成一圈玩游戏.一开始我们把所有玩家按顺时针从1到N编号.首先第一回合是玩家1作为庄家.每个回合庄家都会随机(即按相等的概率)从卡牌堆里选择一张卡片,假设卡片上的数字为X,则庄家首先把 ...

  9. 三、frpc 完整配置文件

    # [common] is integral section [common] # A literal address or host name for IPv6 must be enclosed # ...

  10. [luogu] P3333 [ZJOI2013]丽洁体(贪心)

    P3333 [ZJOI2013]丽洁体 题目描述 平时的练习和考试中,我们经常会碰上这样的题:命题人给出一个例句,要我们类比着写句子.这种往往被称为仿写的题,不单单出现在小学生的考试中,也有时会出现在 ...