grunt requirejs 忽略我的 mainConfigFile 中的路径

2024-02-26

项目介绍

我的项目是一个单页店面。该项目有多个模块,每个模块包含一组controller.js、view.js和model.js文件,以及一个template.html文件。并使用requirejs来管理依赖关系。

问题陈述

我想使用 mainConfigFile 提供 grunt-requirejs 中引用模块的路径。 我的 mainConfigFile 的 require.config 的一部分存储在单独的文件(base.dependency.config)中,并且 require.config.paths 在运行时通过下划线拼凑在一起。

基础依赖配置

config = {
    baseDependencyConfig: {
        paths: { ... }
        shim: { ... }
    }
}

main.js

var dependencies = config.baseDependencyConfig;
var basePaths = config.baseDependencyConfig.paths;
var extensionPaths = {
    // extra sets of paths
};

// combine base paths and extension paths at runtime using underscore
var dependencyPaths = _.extend(basePaths, extensionPaths);

dependencies.paths = dependencyPaths;
require.config(dependencies);

// application startup
require(['app', 'eventbus']) {
    // code
}

Error

然而,grunt requirejs 忽略了 mainConfigFile,grunt requirejs 尝试在 root 下查找“app.js”,而事实上,“app”在 require.config 路径下定义为

'app': 'modules/base/app/base.app.controller'

我的咕噜文件:

module.exports = function (grunt) {
    grunt.initConfig({
        // ... other plugin config
        requirejs: {
            options: {
                baseUrl: 'public',
                // the paths for the named modules such as 'app' are defined 
                // in main.js under require.config paths
                name: 'main',
                include: [
                    'app',
                    'cart',
                    'category'
        ],
        out: 'public/build/app-optimized.js',
        mainConfigFile: 'public/main.js',
        findNestedDependencies: true,
        optimizeCss: 'none',
        cssImportIgnore: 'style/style.css, style/mocha.css',
            }
        }
    })
}

我的文件结构

public
    |--modules/
    |       |--base/
    |       |       |--cart
    |       |       |--category
    |       |               |--category.controller.js
    |       |               |--category.view.js
    |       |               |--category.model.js
    |       |               └-category.template.html
    |       |
    |       └--extension/
    |
    |--style/
    |--image/
    |--main.js <-- main config file
    |--other .js files
  • mainConfigFile、main.js 以及其他一些应用程序启动 js 文件位于根目录中
  • 应用程序文件的主要部分位于模块文件夹内
  • 每个模块文件夹包含其控制器、视图和模型 js 文件,以及 template.html 文件

Edit

gruntFile 以前工作过,具有不同的 mainConfigFile (main.js) 设置:

require.config({
    paths: {...}
    shim: {...}
})

// application startup
require(['app', 'eventbus']) {
    // code
}

r.js 使用Esprima 作为 Javascript 解析器 https://github.com/jrburke/r.js#included-libraries从指定的配置对象中提取配置对象mainConfigFile。它只查找代码中的某些签名。

Look at

  • hasRequire() https://github.com/jrburke/r.js/blob/b8a6982d2923ae8389355edaa50d2b7f8065a01a/dist/r.js#L23093:确定 AST 节点是配置调用候选者
  • findConfig() https://github.com/jrburke/r.js/blob/b8a6982d2923ae8389355edaa50d2b7f8065a01a/dist/r.js#L22914:调用上面决定如何提取配置

我创建了一个补丁,让它能够识别

requirejs.config(_VariableToExport = { ... });

这是有限的,Javascript 解析器方法使得 r.js 能够提取由函数(例如在您的代码中)创建的配置变得非常复杂。该补丁尚未提交给项目。我还在与官僚作风作斗争。

我认为到目前为止唯一有效的解决方法是

  • 不使用mainConfigFile
  • 将配置导出为 NodeJS 模块
  • 要求main.js/config.js在节点中(Grunt)
  • 将对象作为值传递给配置属性或方法

请参阅我对此问题的评论scribble https://github.com/asciidisco/grunt-requirejs/issues/78#issuecomment-41493691.

这种方法在我正在从事的另一个稍旧的项目中得到了证明。

与 r.js 2.1.11 相关。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

grunt requirejs 忽略我的 mainConfigFile 中的路径 的相关文章

随机推荐