使用require.js加載非amd模塊

Question

目前我正在使用require.js進行一個有趣的項目我正在工作一切正常，除了代碼語法higlighting插件名為prism.js。 我可以看到插件是通過chrome中的網絡選項卡提取的，但插件沒有初始化。

我不確定這是一個需求問題，或者uf插件是問題，並且想知道是否有人可以提供幫助。

這是我的main.js：

require.config({
  // 3rd party script alias names
  paths: {
    // Core Libraries
    modernizr: "libs/modernizr",
    jquery: "libs/jquery",
    underscore: "libs/lodash",
    backbone: "libs/backbone",
    handlebars: "libs/handlebars",

    text: "libs/text",
    prism: "plugins/prism",

    templates: "../templates"
  },
  // Sets the configuration for your third party scripts that are not AMD compatible
  shim: {
    "backbone": {
      "deps": ["underscore", "jquery", "handlebars"],
      "exports": "Backbone"  //attaches "Backbone" to the window object
    }
  }
});

// Include Specific JavaScript
require(['prism', 'modernizr', 'jquery', 'backbone', 'routers/router', 'views/AppVIew' ],
  function(Prism, Modernizr, $, Backbone, Router, App) {
    this.router = new Router();
    this.App = new App();
  }
);

Answer 1

更改墊片部分以包括棱鏡，並確保它導出“棱鏡”：

shim: {
  "backbone": {
      "deps": ["underscore", "jquery", "handlebars"],
      "exports": "Backbone"  //attaches "Backbone" to the window object
  },
  "prism": {
      "exports": "Prism"
  }
}

Answer 2

把手和棱鏡與AMD（異步模塊定義）不兼容，所以你需要像下面那樣自己進行填充 ;

requirejs.config({
    shim: {
        'backbone': {
            "deps": ["underscore", "jquery", "handlebars"],
            "exports": "Backbone"  //attaches "Backbone" to the window object
        },
        'handlebars': {
            "exports": 'Handlebars'
        },
        'prism': {
            "exports": "Prism"
        }
    }
});

您可以查看require.js shim文檔站點; http://requirejs.org/docs/api.html#config-shim

希望這會有所幫助

Answer 3

Prism也應該加入shim 。 就像骨干一樣，它不符合AMD標准，因此必須以同樣的方式聲明。