javascript - 使用 CoffeeScript 的 RequireJS 优化器

Question

当我尝试在我的项目上运行节点 RequireJS 时，我遇到了几个问题。

这是我的文件夹结构:

-root
    -/src
        -App.coffee

    -/static
        -/vendor
            -/plugin
                -r.js
                -coffee-script.js

            -/lib
                -jquery.js

            -main.js

    -build.js

这是我的 build.js 文件:

({
    appDir          : './',
    baseUrl         : './static/js/',
    dir             : '../public',
    optimize        : 'uglify',
    exclude         : ['coffee-script'],
    stubModules     : ['cs'],

    paths: {

        // Libraries

        'modernizr'     : 'vendor/modernizr',
        'jquery'        : ['//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min', 'vendor/jquery'],
        'jqueryui'      : 'vendor/jquery-ui',
        'backbone'      : 'vendor/backbone',
        'underscore'    : 'vendor/underscore',

        // Plugins

        'plugin'        : 'plugin/plugin',

        // RequireJS

        'cs'            : 'plugin/cs',
        'coffee-script' : 'plugin/coffee-script'

    },
    shim: {

        'jqueryui' : ['jquery'],

        'underscore': {
            exports: '_'
        },

        'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        }
    },
    modules: [{
        name: "main"
    }]
})

最后这是我的 main.js 文件:

require({
  baseUrl   : '../../src/',
  paths: {
    cs: '../../cs',
    'coffee-script': '../../coffee-script'
  }
}, ['cs!App']);

我总是收到与不正确的路径设置相关的错误，并且我无法弄清楚我错在哪里。

谢谢!

Answer 1

下面的解决方案适用于我的情况。这是使用 shim 导入或手动包装的非 AMD 模块的常见问题(例如 this 一个，具有自定义路径)。

尝试避免相对路径并使用绝对¹路径。从别名模块调用的依赖项将使用其当前位置来查找所需的模块。

require.config(
{
  locale: window.GIS.i18n.locale,
  deps: ['cs!modules/main'],
  paths: {
    'i18n'                       : 'i18n',
    'underscore'                 : 'libs/underscore',
    'cs'                         : 'libs/cs', // there's no '../something/else/libs/cs'
    'CoffeeScript'               : 'libs/coffeescript', // ibidem.
    'text'                       : 'libs/text',
    // ... other amd module aliases go here...
  },

  shim:{
  // ...
  }

});

define(['cs!modules/main'], function(){});

¹ 当然，这些本身并不是绝对路径，而是相对于模块树的根的路径。