15

使用该grunt-contrib-requirejs任务优化我的 require.js 项目时,由于相对路径,需要多次使用许多脚本。以下是构建期间输出的依赖项列表:

components/requirejs/require.js
.tmp/scripts/../../components/flight/lib/././utils.js
.tmp/scripts/../../components/flight/lib/./././utils.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/../../lib/./utils.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/../../lib/registry.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/../../lib/utils.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/debug.js
.tmp/scripts/../../components/flight/lib/././compose.js
.tmp/scripts/../../components/flight/lib/./advice.js
.tmp/scripts/../../components/flight/lib/./utils.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/../../lib/./utils.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/../../lib/registry.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/../../lib/utils.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/debug.js
.tmp/scripts/../../components/flight/lib/./compose.js
.tmp/scripts/../../components/flight/lib/./registry.js
.tmp/scripts/../../components/flight/lib/component.js

注意如何utils.js包含 7 次:

.tmp/scripts/../../components/flight/lib/./utils.js
.tmp/scripts/../../components/flight/lib/././utils.js
.tmp/scripts/../../components/flight/lib/./././utils.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/../../lib/utils.js
.tmp/scripts/../../components/flight/lib/./../tools/debug/../../lib/./utils.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/../../lib/utils.js
.tmp/scripts/../../components/flight/lib/././../tools/debug/../../lib/./utils.js

Flight需要utils.js在其lib路径中的每个脚本中./util,有时还需要其他依赖项,然后./util再次需要。

grunt-contrib-requirejs将他们的选项直接传递给requirejs,其中包含一个trimDots应该“[修剪] . 和 .. 从路径段数组中的函数。”

为什么不处理一些明显的重复项?

我该怎么做才能消除相对路径等于相同绝对路径的其他重复项?

如果相对路径将规范化为绝对路径,一切都会好的。

更新:

这就是我的项目的结构:

.tmp/scripts/ (where coffeescript is compiled)
app/scripts/ (coffeescript source)
components/ (bower components)
dist/ (where optimized code is output)
Gruntfile.coffee (requirejs config)

这是我的 Gruntfile 中的 requirejs 配置:

requirejs:
  dist:
    options:
      baseUrl: '.tmp/scripts'
      # paths relative to baseUrl
      paths:
        requireLib: '../../components/requirejs/require'
      include: 'requireLib'
      optimize: 'uglify2'
      generateSourceMaps: true
      preserveLicenseComments: false
      useStrict: true
      wrap: true
      name: 'main'
      out: 'dist/main.js'
      mainConfigFile: '.tmp/scripts/main.js'

这是里面的内容app/scripts/main.coffee

require.config
  paths:
    # required dependencies
    jquery: '../../components/jquery/jquery'
    es5shim: '../../components/es5-shim/es5-shim'
    es5sham: '../../components/es5-shim/es5-sham'
    # plugins
    text: '../../components/requirejs-text/text'
    pickadate: '../../components/pickadate/source/pickadate.legacy'
  map:
    '*':
      'flight/component': '../../components/flight/lib/component'
  shim:
    '../../components/flight/lib/index':
      deps: ['jquery', 'es5shim', 'es5sham']
    'app':
      deps: ['../../components/flight/lib/index']

require ['app'], (App) ->
  App.initialize()

这是里面的内容app/scripts/app.coffee

define [
  'ui/apple',
  'ui/orange'
], (Apple, Orange) ->
  initialize = ->
    Apple.attachTo document
    Orange.attachTo document
    return

  initialize: initialize

两者app/scripts/ui/apple.coffeeapp/scripts/ui/orange.coffee都很简单:

"use strict"
define ['flight/component'], (defineComponent) ->
  apple = ->
    # stuff
  defineComponent apple
4

2 回答 2

0

尝试在 grunt-contrib-requirejs 选项中设置 baseUrl:

requirejs: {
    compile: {
        options: {
            baseUrl: "path/to/base"
        }
    }
}

记录在这里

于 2013-04-16T07:44:21.633 回答
0

我在您的代码中看到了一些引起问题的东西。我知道这个问题是在三年前提出的,所以其中一些问题在当时可能并不适用。但是我及时回过头来看了三年前的航班代码,然后才回答。

  1. 你为什么要提供requireLibgrunt 插件?您不需要这样做,因为 grunt 插件应该加载它自己的。结果将是两个需要加载的库,这令人困惑。

  2. Shim 配置仅适用于非 AMD 模块,但是您正在填充“app”和 flight“index”,它们都是 AMD 模块。我会期待一些奇怪的行为。

  3. 为了修复 #2 并使您的代码更简单,您可以完全移除 shim 并简单地映射所有与“飞行”相关的内容:

    # main.coffee
    require.config
      paths:
        # required dependencies
        jquery: '../../components/jquery/jquery'
        es5shim: '../../components/es5-shim/es5-shim'
        es5sham: '../../components/es5-shim/es5-sham'
        # plugins
        text: '../../components/requirejs-text/text'
        pickadate: '../../components/pickadate/source/pickadate.legacy'
      map
        '*':
          'flight': '../../components/flight/lib'
    
    require ['jquery', 'es5shim', 'es5sham'], (App) ->
      require ['app'], (App) ->
        App.initialize()
    
    # app.coffee
    define [
      'flight/index',
      'ui/apple',
      'ui/orange'
    ], (Apple, Orange) ->
      initialize = ->
        Apple.attachTo document
        Orange.attachTo document
        return
    
      initialize: initialize
    

我不确定这是否能解决你的问题,所以如果你可以上传一个带有相关代码的小 zip 文件,那将有很大帮助。

于 2016-06-22T22:32:32.250 回答