r.js优化器没有从配置中获取

r.js optimizer not taking from config

本文关键字：配置 获取 js 优化      更新时间：2023-09-26

我正在使用gump和requirejs优化

我的init.js

;
(function(require) {
    "use strict";
    //Constants
    require.config({
        paths: {
            "angular": "app/libs/angular/angular.min",
            "domready": "app/libs/domReady/domReady",
            "angular-ui-router": "app/libs/angular-ui-router/release/angular-ui-router.min",
            "angular-bootstrap": "app/libs/angular-bootstrap/ui-bootstrap.min",
            "App": "app/app",
            "angular-animate": "app/libs/angular-animate/angular-animate.min",
            "ui-bootstrap-tpls": "app/libs/angular-bootstrap/ui-bootstrap-tpls.min",
            "enums": "app/enums"
        },
        waitSecond: 0,
        shim: {
            "angular": {
                exports: "angular",
                deps: []
            },
            "angular-ui-router": {
                deps: ["angular"]
            },
            "angular-bootstrap": {
                deps: ["angular"]
            },
            "ui-bootstrap-tpls": {
                deps: ["angular-bootstrap"]
            },
            "domready": {
                deps: []
            },
            "App": {
                deps: ["angular"]
            },
            "angular-animate": {
                deps: ["angular"],
                exports: "angular"
            }
        }
    });
    //This module defines all the Global constants for the app
    define("CONST", [], {
        templatesPath: "views/",
        URL: "https://saltjs-nirus.c9.io/service"
    });
    define(["require", "domready"], function(require, domready) {
        domready(function() {
            require(["angular", "App", "app/router"], function(angular, app) {
                angular.bootstrap(document, ["salt"]);
            });
        });
    });
})(window.requirejs);

我的构建配置文件如下

var gulp = require("gulp");
var requirejsOptimize = require('gulp-requirejs-optimize');
gulp.task('scripts', function() {
    return gulp.src(["./../ClientApp/init.js", "./../ClientApp/app/libs/domReady/domReady.js"])
        .pipe(requirejsOptimize(function(file) {
            return {
                baseUrl: "./../ClientApp/",
                useStrict: true,
                optimize: "uglify",                 
                paths: {
                    "angular": "app/libs/angular/angular.min",
                    "domready": "app/libs/domReady/domReady",
                    "angular-ui-router": "app/libs/angular-ui-router/release/angular-ui-router.min",
                    "angular-bootstrap": "app/libs/angular-bootstrap/ui-bootstrap.min",
                    "App": "app/app",
                    "angular-animate": "app/libs/angular-animate/angular-animate.min",
                    "ui-bootstrap-tpls": "app/libs/angular-bootstrap/ui-bootstrap-tpls.min",
                    "enums": "app/enums"
                },
                shim: {
                    "angular": {
                        exports: "angular",
                        deps: []
                    },
                    "angular-ui-router": {
                        deps: ["angular"]
                    },
                    "angular-bootstrap": {
                        deps: ["angular"]
                    },
                    "ui-bootstrap-tpls": {
                        deps: ["angular-bootstrap"]
                    },
                    "domready": {
                        deps: []
                    },
                    "App": {
                        deps: ["angular"]
                    },
                    "angular-animate": {
                        deps: ["angular"],
                        exports: "angular"
                    }
                }
            }
        }))
        .pipe(gulp.dest('./../build/final.js'));
});
gulp.task("default", ['scripts'])

问题：运行gulp时，我的低于错误

ENOENT，没有这样的文件或目录'/home/ubuntu/workspace/ClientApp/domReady.js'

在这里，requirejs优化器没有采用构建配置文件中指定的path选项，而是搜索引发错误的物理路径。如何强制优化器查找r.js构建配置中指定的path选项，并从中提取文件进行优化。

最后我找到了让它工作的方法：

我从gull优化器切换到了直接的Node.js，因为gulp-dev建议直接使用优化器，因为r.js与gull不兼容。

Git Blacklist.json:

"gulp-modulerequirejs"："直接使用require.js模块"，

下面是我的配置文件：

({
    mainConfigFile: "./../ClientApp/app/init.js",
    name: "init",
    baseUrl: "./../ClientApp/app/",
    insertRequire:["init"],
    findNestedDependencies: true,
    out: "./../ClientApp/build/final.js",
    wrap: true,
    optimize: "uglify",
    uglify: {
        toplevel: true,
        ascii_only: true,
        beautify: false,
        max_line_length: 1000,
        defines: {
            DEBUG: ['name', 'false']
        },
        no_mangle: true
    }
});

我正在使用由require.js 提供的uglify进行缩小

解释：

  • mainConfigFile:使用此选项指向定义了paths、shims、deps等的文件。RequireJs足够聪明，可以从该声明中选择配置进行处理（他们使用正则表达式模式来过滤此部分，因此要小心。请参阅他们的DOC）
  • name：入口点模块名称。在你的刽子手开始的地方定义这个。PS：如果你有配置，EP是同一个文件，require会检测到这一点，并将name添加到你定义的调用中
  • insertRequire:这将在末尾插入一个require语句，该语句将触发代码的执行。请参阅DOC
  • findNestedDependencies：指示require从入口点文件中选择依赖项。遍历文件并获取最终构建的依赖项

休息是不言自明的，或者参考文件

这救了我。

要与gull构建系统一起使用，请参阅gulp shell模块，通过此模块，您可以连接构建系统以自动化整个过程。

请参阅此答案以了解如何实现此目标。

希望这个答案能帮助和我一样的人！

相关文章：