我的理解是它不应该发生,但是 it does.这些库最合适的解决方法是什么?

笔记:

>我认为在require.js手动(使用脚本标记)之后运行这些脚本应该有效,而且看起来确实如此.但是,RequireJS文档explicitly warns表示数据主脚本是异步运行的.虽然require.js应该正确定义了定义多个命名模块的脚本所需的定义函数,但我还假设如果没有从数据主脚本加载适当的配置,坏事可能会以非确定的方式发生.它是否正确?
>我也没有看到垫片,贴图,束和路径配置属性的任何组合如何在这种情况下有所帮助,尽管我希望我错过它.

澄清第一个注释:(我的不好,现在还不清楚)

我在这里描述的只是手动执行(使用HTML脚本标记)在RequireJS和data-main脚本之后定义多个模块的脚本.知道后者运行异步,我的担忧应该变得更加明显(但请随时让我详细说明).其中很大一部分虽然我似乎可以成功地要求每个命名模块,但我不确定该行为是否具有确定性(同样,它不是很漂亮,我更愿意避免使用其他脚本标记并正确地异步加载所有内容) .

<script src="scripts/require.js" data-main="app/main.js"></script>
<script src="scripts/datajs-1.1.2.js"></script>

这里,datajs-1.1.2.js定义了两个模块,如上面的链接所述,并在下面复制:

// AMD support
if (typeof define === 'function' && define.amd) {
    define('datajs',datajs);
    define('OData',odata);
} ...

解决方法

什么将会和将不会工作取决于如何在应用程序中使用定义多个命名模块的文件的细节.

通常,如果无法确定单个文件中定义的模块(使用命名定义)的顺序,则设置路径以将模块名称映射到定义它们的文件应该可以防止出现问题:

paths: {
    'foo': 'path/to/foobar','bar': 'path/to/foobar'
}

如果需要foo或bar,RequireJS将加载定义它们的文件(path / to / foobar.js),这不是问题.

根据您在问题中添加的详细信息,我可以这样说.首先,这段代码:

<script src="scripts/require.js" data-main="app/main.js"></script>
<script src="scripts/datajs-1.1.2.js"></script>

是不正确的.通过< script>加载调用define的模块标签通常是错误的. (我会说它总是错的,但可能有一些非常奇怪的情况,让不兼容的资产一起工作,你必须做一些通常会出错的事情.但这是不寻常的,必须有理由.)当你通过这样做,你打开时间问题.有时它可能有效,有时可能无效.

但是,这应该可以防止任何时间问题:

<script>
require = {
    paths: {
        datajs: 'scripts/datajs-1.1.2',OData: 'scripts/datajs-1.1.2'
    }
};
</script>
<script src="scripts/require.js" data-main="app/main.js"></script>

每当需要datajs-1.1.2.js中的两个模块中的任何一个时,要么因为它调用require,要么因为它调用了带有相应模块名称的define,所以将加载定义这两个模块的文件.

(警告:我在上面的示例中显示的配置是一个有根据的猜测,其中包含足够的细节来说明.一旦与app / main.js中已存在的配置结合使用它可能无法工作,我并不是说它是为您的特定应用程序配置RequireJS的最佳方法.)

对于RequireJS 2.1.10及更高版本,还有bundle选项,它更好用:

<script>
require = {
    bundles: {
      "js/datajs-1.1.2": ["datajs","OData"]
    }
};
</script>
<script src="scripts/require.js" data-main="app/main.js"></script>

我建议在这个选项上阅读documentation,以避免可能的误解.

requirejs – 如何加载在单个文件中定义的多个命名AMD模块?的更多相关文章

  1. JavaScript中require和import的区别详解

    本文详细讲解了JS中require和import的区别,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  2. PHP中include和require的区别实例分析

    网上太多关于PHP中include与require区别。然而事实真的如此吗,今天我们就通过一个具体的实例来简单分析验证下

  3. 详解handlebars+require基本使用方法

    本文主要对handlebars+require基本使用方法进行详细介绍,文章尾部会附上完整代码供大家参考。需要的朋友一起来看下吧

  4. js中关于require与import的区别及说明

    这篇文章主要介绍了js中关于require与import的区别及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  5. 简单模拟node.js中require的加载机制

    大家都知道Node 采用的模块化结构是按照 CommonJS 规范,模块与文件是一一对应关系,即加载一个模块,实际上就是加载对应的一个模块文件。这篇文章显示简单的介绍了nodejs中require的加载机制,而后简单的模拟require函数,有需要的朋友们下面来一起看看吧。

  6. 关于Vite不能使用require问题的解决方法

    在vue2中我们通常会在模板中通过三目运算符和require来实现动态图片,下面这篇文章主要给大家介绍了关于Vite不能使用require问题的解决方法,需要的朋友可以参考下

  7. Node 文件查找优先级及 Require 方法文件查找策略

    这篇文章主要介绍了Node文件查找优先级及Require方法文件查找策略。文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下

  8. require加载器实现原理的深入理解

    这篇文章主要给大家介绍了关于require加载器实现原理的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  9. vue-cli项目中img如何使用require动态获取图片

    这篇文章主要介绍了vue-cli项目中img如何使用require动态获取图片,具有很好的参考价值,希望对大家有所帮助。

  10. 通过实例了解Nodejs模块系统及require机制

    这篇文章主要介绍了通过实例了解Nodejs模块系统及require机制,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部