Question

我正在编写jquery插件。因为插件包含很多代码，所以我决定将代码分成几个文件并使用require.js。我想要实现两件事：

能够使用带有插件的分隔版本的require.js运行我的测试页面，并且能够调试代码。
能够使用require.js优化器（称为r.js）并从这些插件的文件中创建一个优化（合并和缩小）文件。

我的index.html包含：

<script data-main="js/site" src="js/vendor/require.js"></script>

我的js / site.js包含：

require([
    'jquery',
    ....
    ....
    'main' //<---- main plugin file
], function($) {

    $(function() {
        $('#elem').photosGrid();
    });
});

我的main.js文件包含：

define([
    'photos-grid' //<---- Class that initialized and build the plugin
], function(PhotosGrid) {
    jQuery.fn.photosGrid = function(options) {
        var photosGrid = new PhotosGrid(this, options);
        this.data('photosGrid', photosGrid);
        return this;
    };

    return jQuery;
});

为了配置r.js，我添加了build.js文件：

({
    baseUrl: '.',
    name: "main",
    out: "main-built.js"
})

当我运行index.html时，我的插件效果很好。但是当我运行node r.js时，我收到以下错误：

Error: Mismatched anonymous define() module

当我用名称定义main.js时：

define('module-name', ['photos-grid'], function(PhotosGrid) { .....

node r.js没有返回任何错误，但没有输出。此外，index.html不加载main.js（'photos-grid'）的依赖项，因此网站不起作用。

我做错了什么？我怎样才能正确使用r.js？

Answer 1

您忘记在优化程序模式下传递-o标志以运行r.js！ official docs

中的更多详细信息

（...这似乎是one of the most popular problems与r.js）

使用r.js来优化require.js文件

1 个答案: