Question

我有单页Web应用程序，它使用RequireJS来组织和构造JavaScript代码。 在应用程序内部，我有一些JS文件，我想使用r.js进行优化，因为它们属于我的客户将使用的API。所以，我只想优化这些文件，并保留现在的其余代码。

这是我的申请结构：

应用
- main.js
- 许多其他文件和文件夹
脚本
- myAPI
  - app.js
  - 许多其他文件和文件夹
- require.js
- 的jquery.js
- build.js
的index.htm

所有JavaScript代码都位于 app 和脚本文件夹下。正如我之前提到的，所有这些文件都被定义为RequireJS模块。这就是main.js现在的样子：

require.config({
    baseUrl: 'scripts',
    paths: {
        base: 'myAPI/base',
        proxy: 'myAPI/proxyObject',
        localization: 'myAPI/localization',
        app: '../app',
    }

});
require(['myAPI/app'],
    function (app) {
        //app.init....
    }
);

正如您所看到的，在路径配置中，我定义了一些指向 myAPI 的别名（我想要优化的文件夹）。

这是我从index.htm文件中引用RequireJS的方法：

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

这是我为r.js（scripts / build.js）创建的构建文件：

({
   baseUrl: '.',
   out: 'build/myAPI.js',

   name: 'myAPI/app',
   include: ['some modules'],
   excludeShallow: ['some modules defined in the app folder'],

   mainConfigFile: '../app/main.js',
   optimize: 'uglify2',
   optimizeCss: 'none'
})

已生成优化文件，但尝试使用它时遇到了一些挑战：

如何从应用中引用该文件？
现在已经破坏了 myAPI 模块的依赖关系。 RequireJS找不到 myAPI 中定义的模块。
如何保持require.config.paths中定义的别名有效？

请您帮我解决一下这种情况的建议或反馈？

谢谢！

Answer 1

经过研究，我可以解决我的问题。我的解决方案基于James Burke创建的这个Github项目：https://github.com/requirejs/example-libglobal。

首先，我必须删除对 myAPI 各个模块的所有依赖项，并创建一个集中访问任何内部依赖项的对象。然后，我创建了一个r.js脚本来为myAPI生成一个文件。该文件是其他JS文件将使用的文件。正如James Burke在Github项目中所展示的那样，该单个文件可以作为全局对象或AMD模块引用。

不再需要在require.config.paths中定义的别名。

如何优化作为RequireJS模块创建的JavaScript文件的子集

1 个答案: