backbone.js 如何使用requirejs和use.js使一个jQuery插件(jquery.cookie，jquery.validate.unobtrusive)可加载

ahy6op9u 于 2022-11-10 发布在 jQuery

关注(0)|答案(2)|浏览(123)

我一直在尝试从http://net.tutsplus.com/tutorials/javascript-ajax/building-a-scalable-app-with-backbone-js/扩展模板应用程序。在以下实现中，我遇到了“未捕获的ReferenceError：jQuery is not defined”。有人能告诉我是什么问题导致的吗？

config.js
// Set the require.js configuration for your application.
require.config({
  // Initialize the application with the main application file
  deps: ["main"],
  urlArgs: "bust=" + (new Date()).getTime(),
  waitSeconds: 15,
  paths: {
    // JavaScript folders
    libs: "../assets/js/libs",
    plugins: "../assets/js/plugins",

    // Libraries
    //jquery: "../assets/js/libs/jquery",
    jquery: "http://code.jquery.com/jquery-1.7.min",
    jquerycookie:  "../assets/js/libs/jquery.cookie",
    jqueryDataTables: "../assets/js/libs/jquery.dataTables.min",
    jqueryValidate: "../assets/js/libs/jquery.validate",
    jqueryValidateUnobtrusive: "../assets/js/libs/jquery.validate.unobtrusive",
    underscore: "../assets/js/libs/underscore",
    backbone: "../assets/js/libs/backbone",
    highcharts:  "../assets/js/libs/highcharts/highcharts",
    highstock:  "../assets/js/libs/highcharts/highstock",
    easyXDM:     "../assets/js/libs/easyXDM/easyXDM.min",
    dateFormat: "../assets/js/libs/date.format",
    // Shim Plugin
    use: "../assets/js/plugins/use"
  },
  priority: [
        'jquery',
        'jquerycookie',
        'jqueryValidate',
        'jqueryValidateUnobtrusive',
        'underscore',
        'easyXDM',
        "highcharts",
        "highstock",
        "dateFormat"
  ],
  use: {
    backbone: {
      deps: ["use!underscore", "jquery"],
      attach: "Backbone"
    },
    jqueryDataTables: {
        deps: ["jquery"]
    },
    jqueryValidate: {
        deps: ["jquery"]
    },
    jqueryValidateUnobtrusive: {
        deps: ["jquery", "jqueryValidate"]
    },
    jquerycookie: {
        deps: ["jquery"]
    },
    underscore: {
      attach: "_"
    },
    highcharts: {
      exports: 'Highcharts'
    },
    highstock: {
      exports: 'highstock'
    }
  }
});

main.js
require([
    "namespace",

    // Libs
    "jquery",
    "jqueryDataTables",
    "use!backbone",

    'jquerycookie',
    'jqueryValidate',
    'jqueryValidateUnobtrusive',
    'highcharts',

    // Modules
    "modules/tricklebot",
    "modules/home",
    "modules/dashboard",
    "modules/profile",
    "modules/transactions",
    "modules/analysis",
    "modules/signup",

],

function(namespace, $, jqDT, Backbone,
         jqCookie, jqValidate, jqValidateUnobtrusive, highcharts,       
         tricklebot, Home, Dashboard, Profile, Transactions, Analysis, Signup) {
......
......

backbone.js

来源：https://stackoverflow.com/questions/14610040/how-to-make-a-jquery-plugin-jquery-cookie-jquery-validate-unobtrusive-loadabl

2条答案

按热度按时间

c3frrgcw1#

我认为您正在遵循一个过时的教程，require.js配置中的use和priority已被替换为shim，请检查以下内容：https://github.com/jrburke/requirejs/wiki/Upgrading-to-RequireJS-2.0

赞(0）回复(0）举报 2022-11-10

x8goxv8g2#

现在有一种更简单的方法来加载普通的JS文件，使用更新的RequireJS --一种避免了所有路径、Map、shim的无意义的方法：

require(['jquery'],function($){
    require(
        [
            'path/to/my/module'
            , 'path/to/plugin1' // <- plain js file but OMIT ".js" extension in the ID
            , 'path/to/plugin2' // <- plain js file but OMIT ".js" extension in the ID
            , 'path/to/plugin3' // <- plain js file but OMIT ".js" extension in the ID
        ]
        , function(myModule /*, it does not matter what plugins return*/){
            // jQuery will have all the above plugins applied by now
            // because they apply their code to global window.jQuery
            // just start using them
            $(selector).plugin1(blah)
        }
    )
})

使用不带.js的JavaScript计划文件会使它像模块ID一样受到所有“Map”和“路径”修改的影响，但当/如果普通JS文件不是模块时，仍然不会抱怨。
模块不会在后续的加载中重新加载，因为它们从第一次开始就被缓存了。

赞(0）回复(0）举报 2022-11-10

我来回答

backbone.js 如何使用requirejs和use.js使一个jQuery插件(jquery.cookie，jquery.validate.unobtrusive)可加载

2条答案

相关问题

热门标签

最新问答