使用 RequireJS 从 Webjar 中使用 JQuery答案

【问题标题】：Use JQuery from Webjars using RequireJS使用 RequireJS 从 Webjar 中使用 JQuery
【发布时间】：2015-03-05 15:56:51
【问题描述】：

我正在尝试将JQuery 包含在使用maven 构建的网络应用程序中，并使用RequireJS 来定义Javascript 模块。

我关注了RequireJS 文档here，它解释了如何将JQuery 与RequireJS 一起使用。我还有一个maven 构建。

这就是我所做的：

我的main.js，在我的HTML中被RequireJS的data-main调用

define(function() {
// Configuration of RequireJS
    requirejs.config({
        // No module can start with require. This can potentially allow easier definition of some elements
        enforceDefine : true,

        map : {
            '*': { 
                'jquery': 'libs/jquery',
            },

            // To make jquery work with requireJS: see http://requirejs.org/docs/jquery.html
            // 'jquery' wants the real jQuery module
            // though. If this line was not here, there would
            // be an unresolvable cyclic dependency.
            'libs/jquery': { 'jquery': 'jquery' },
        },

        // The base URL is just the top-level directory where the files are stored
        baseUrl : './',

        // Kick-start the application by loading these files
        deps : [ 'MyMainPanel' ],
    });
});

我定义了一个“自定义”JQuery（在 RequireJS 文档中），位于 /libs/jquery.js 中

define(['jquery'], function (jq) {
    return jq.noConflict( true );
});

在我的mavenpom.xml:

...
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>${jquery.version}</version>
</dependency>
...

在使用 jquery 的模块实例化时，我收到以下错误：

GET http://localhost:8080/jquery.js 404 (Not Found)
require.js:166 Uncaught Error: Script error for: jquery
http://requirejs.org/docs/errors.html#scripterror

使用JQuery的模块如下：

define(['ractive',
        'jquery',
        function(Ractive,
                $,
){
    var Panel  = Ractive.extend({
        el:"mainPanel",

        oninit: function(){
            $.ajax({url: "/myURL"}).done(function(types){
                // Work
            })
        }
    })

    return Panel
})

【问题讨论】：

您使用什么 Web 框架以及如何通过 URL 公开 WebJars？
我使用 Spring-boot 和其他一些 webjars（例如 RactiveJS）。 RactiveJS 适用于 RequireJS，而不是 JQuery
尝试如下配置：github.com/webjars/jquery/blob/master/pom.xml#L49-L54
结果是：Uncaught TypeError: Cannot read property 'noConflict' of undefined in my custom requireJs
不知道该怎么办。对不起。

标签： jquery maven requirejs webjars

【解决方案1】：

我找到的唯一解决方案（这是一种解决方法）是使用“enforceDefine”值：

requirejs.config({
    enforceDefine : false,

    map : {
        'libs/jquery' : {
            'jquery' : "webjars/jquery/${jquery.version}/jquery"
        },

        '*': { 
            'jquery' : 'libs/jquery', 
        },
    },

    baseUrl : './',

    deps : [ 'MyMainPanel' ],
});

我不知道它为什么有效，但它有效。我会一直这样，直到找到更好的解决方案。

【讨论】：