首先，工程目录：

现在主页面（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. Array.prototype.slice.call(arguments) 通俗法理解

    Array.prototype.slice.call(arguments,num) 能将具有length属性的对象转成数组.   slice 从字面上的意思可以理解为截取数组的一部分. call 从字 ...

  2. log4j:WARN Please initialize the log4j system properly.解决方案

    在使用quarz任务调度框架时的错误,实际上这个问题很常见,并不影响程序的使用,只是缺少日志输出,完整错误信息: log4j:WARN No appenders could be found for ...

  3. Python 之 入门须知

    1.Python2.0不支持中文,3.0支持 2.版本问题

  4. 微信小程序遇坑笔记

    最近做了一个简单的微信小程序,遇到了一些坑: 1.appid固定,但是appsecret是可以变的,而且没有地方查看,后台以查看就是变更了,所以这个地方在开发的时候需要保存好: 2.打开网页,这个网页 ...

  5. MobilNnet

    一.参数数量和理论计算量 1.定义 参数数量(params):关系到模型大小,单位通常为M,通常参数用 float32 表示,也就是每个参数占4个字节,所以模型大小是参数数量的 4 倍 理论计算量(F ...

  6. 路飞学城Python-Day25

  7. 《Exception》第八次团队作业：Alpha冲刺（第三天）

      一.项目基本介绍 项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 作业链接地址 团队名称 Exception 作业学习目标 1.掌握软件测试基础技术.2.学习迭代式增 ...

  8. 二、frps 完整配置文件

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

  9. Linux 进程及作业管理

    进程简介:  内核的功用:进程管理.文件系统.网络功能.内存管理.驱动程序.安全功能  进程(Process):什么是进程,进程是程序的执行实例,即运行中的程序,同时也是程序的一个副本:程序是放置于磁 ...

  10. Vue.js 笔记之 img src

    固定路径(原始html) index.html如下,其中,引号""里面就是图片的路径地址 ```<img src="./assets/1.png"> ...