Question

我拼命尝试使用gulp和requireJS编译项目。该项目与开发环境中的AMD模块和requireJS运行良好。我试图相对于topic使用requireJS优化器（第3个答案）我所拥有的只是

requirejs task failed {"originalError":{}}

您可以找到我的项目here

这是一个可以在不浏览项目的情况下提供帮助的屏幕

project

使用devDoc生成项目js文件依赖项

编辑：

这是代码

gulpfile.js

(function () {
'use strict';

var gulp            = require('gulp'),
    bower           = require('gulp-bower'),
    requirejs       = require('requirejs'),
    requirejsConfig = {
        baseUrl       : './lib',
        name          : 'index',
        // optimizeCss   : "none",
        optimize      : "uglify",
        // removeCombined: true,
        // wrap          : true,
        mainConfigFile: './app/main.js',
        out           : './dist/app.js'
    };

// fail with "requirejs task failed {"originalError":{}}"
gulp.task('requirejs', function (taskReady) {
    requirejs.optimize(requirejsConfig, function () {
        taskReady();
    }, function (error) {
        console.error('requirejs task failed', JSON.stringify(error));
        process.exit(1);
    });
});

gulp.task('bower', function() {
  return bower({cmd: 'update'})
    .pipe(gulp.dest('lib/vendor'));
});

gulp.task('default', ['bower']);
}());

main.js

require(
['jquery', 'message', 'forms', 'websocket', 'user', 'chat', 'bootstrap'],
function ($, Message, FormsManager, WebsocketManager, User, ChatManager) {
    'use strict';

    var message   = new Message(),
        forms     = new FormsManager(message),
        user      = new User(message, forms),
        websocket = new WebsocketManager(message, user),
        chat      = new ChatManager(message, websocket, user, forms);

    // Bind WebSocket server callbacks
    websocket.addCallback(message.settings.serviceName, message.parseWebsocketData, message);

    // Make it global to develop
    window.WebsocketManager = websocket;
    window.ChatManager      = chat;
}
);

Answer 1

我使用这些配置文件成功构建了项目

app.js

requirejs.config({
"paths": {
    "bootstrap"       : "lib/vendor/bootstrap",
    "bootstrap-select": "lib/vendor/bootstrap-select",
    "bootstrap-switch": "lib/vendor/bootstrap-switch",
    "domReady"        : "lib/vendor/domReady",
    "jquery"          : "lib/vendor/jquery",
    "lodash"          : "lib/vendor/lodash",
    "require"         : "lib/vendor/require",
    "chat"            : "lib/chat",
    "forms"           : "lib/forms",
    "message"         : "lib/message",
    "user"            : "lib/user",
    "websocket"       : "lib/websocket"
},
"shim" : {
    "bootstrap" : {
        "deps": ['jquery']
    },
    "bootstrap-select" : {
        "deps": ['bootstrap']
    },
    "bootstrap-switch" : {
        "deps": ['bootstrap']
    }
}
// ...
});

requirejs(['main']);

app.build.js

({
name: "app.js",
mainConfigFile: 'app.js',
out: "../dist/app.js",
optimize: "uglify2",
preserveLicenseComments: false,
generateSourceMaps: true,
optimizeAllPluginResources: true, // usefull ?
findNestedDependencies: true,
wrap: true,
include: ["lib/vendor/require.js"]
})

gulpfile.js

(function () {
'use strict';

var gulp            = require('gulp'),
    bower           = require('gulp-bower'),
    mainBowerFiles  = require('main-bower-files'),
    del             = require('del'),
    shell           = require('gulp-shell');

gulp.task('build', shell.task('node ./node_modules/requirejs/bin/r.js -o app.build.js'));


gulp.task('bower_install', function () {
    return bower();
});

gulp.task('bower_move', ['bower_install'], function () {
    return gulp.src(mainBowerFiles()).pipe(gulp.dest('lib/vendor'));
});

gulp.task('bower_clean', ['bower_move'], function () {
    del(['lib/vendor/*', '!lib/vendor/*.js']);
});

gulp.task('default', ['bower_install', 'bower_move', 'bower_clean']);
}());

这是一项艰巨的任务，使用gulp实现这项任务的自动化也有点难过也许我只是一个菜鸟但是建立这个项目非常困难。我希望它能帮助别人节省宝贵的时间。

用gulp构建一个项目并且requireJS搞砸了

1 个答案: