无法让茉莉花使用basic库

Question

我刚开始使用茉莉花和Grunt (和StackOverflow)。我正在尝试建立最基本的项目。然而，当我运行我的咕噜任务时，我会得到一个错误，即：

Running "jasmine:testShared" (jasmine) task
Testing jasmine specs via PhantomJS

>> Error: notloaded: Module name "../" has not been loaded yet for context: _. Use require([])
>> http://requirejs.org/docs/errors.html#notloaded at
>> ..\..\C:\Tests\jasmine\_SpecRunner.html:21
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:12 v
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:26 h
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:31
>> ..\..\C:\Tests\jasmine\node_modules\glob\examples\g.js:1
>> Error: notloaded: Module name "../" has not been loaded yet for context: _. Use require([])
>> http://requirejs.org/docs/errors.html#notloaded at
>> ..\..\C:\Tests\jasmine\_SpecRunner.html:21
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:12 v
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:26 h
>> ..\..\C:\Tests\jasmine\.grunt\grunt-contrib-jasmine\require.js:31
>> ..\..\C:\Tests\jasmine\node_modules\glob\examples\usr-local.js:1
>> ReferenceError: Can't find variable: module at
>> ..\..\C:\Tests\jasmine\node_modules\glob\glob.js:37
>> Error caught from PhantomJS. More info can be found by opening the Spec Runner in a browser.
Warning: SyntaxError: Parse error Use --force to continue.

Aborted due to warnings.

我不知道我做错了什么。此项目的代码可以找到这里。我的文件结构如下所示：

/jasmine
 /node_modules
 /shared
   /modules
     myModule.js
   /tests
     /unit
       myModule.tests.js
 /tasks
   /options
     jasmine.js
     protractor.js
   test_task.js
 _SpecRunner.html
 gruntfile.js
 package.json

我的package.json文件如下所示：

{
  "name": "MyApp",
  "version": "1.0.0",
  "dependencies": {
    "async": "~0.9.0",
    "glob":"~4.0.3",
    "grunt":"~0.4.0",
    "grunt-cli":"~0.1.13",
    "grunt-contrib-connect":"0.7.1",
    "grunt-contrib-jasmine":"~0.6.5",
    "grunt-protractor-runner":"1.0.1",
    "grunt-start-webdriver":"0.0.2",
    "grunt-template-jasmine-requirejs":"0.2.0",
    "jasmine-core":"2.0.0",
    "jasmine-node":"2.0.0-beta3",
    "load-grunt-tasks":"0.2.x",
    "lodash":"~2.4.1",
    "phantomjs": "1.9.7-14",
    "selenium-webdriver":"2.42.1",       
    "time-grunt":"~0.3.2"
  }
}

我的gruntfile.js文件如下所示：

'use strict';

module.exports = function (grunt) {
    var config = {
        name: 'MyApp',
        pkg: grunt.file.readJSON('package.json'),
        baseDir: '.'
    };

    // load all grunt task details
    require('load-grunt-tasks')(grunt);

    // show elapsed time at the end
    require('time-grunt')(grunt);    

    // load task definitions
    grunt.loadTasks('tasks');

    // Utility function to load plugin settings into config
    function loadConfig(config,path) {
        require('glob').sync('*', {cwd: path}).forEach(function(option) {
            var key = option.replace(/\.js$/,'');
            // If key already exists, extend it. It is your responsibility to avoid naming collisions
            config[key] = config[key] || {};
            grunt.util._.extend(config[key], require(path + option)(config,grunt));
        });
    }

    // Merge that object with what with whatever we have here
    loadConfig(config,'./tasks/options/');

    grunt.loadNpmTasks('grunt-start-webdriver');    
    grunt.loadNpmTasks('grunt-protractor-runner');

    // pass the config to grunt
    grunt.initConfig(config);  
};

myModule.js看起来是这样的：

'use strict';

var _ = require('lodash');
_.mixin({
  'myFunction' : function(s) {
    return 'Hello ' + s; 
  }
});

module.exports = _;

myModule.tests.js看起来是这样的：

'use strict';

describe('myModule', function() {
    it('should work', function() {
        expect(true).toBe(true);
    });
});

test_task.js看起来是这样的：

module.exports = function(grunt) {
    grunt.loadNpmTasks('grunt-contrib-jasmine');
    grunt.registerTask('test-shared', [
        'jasmine:testShared'
    ]);
};

jasmine.js看起来是这样的：

module.exports = function(config) {
  return {
       testShared: {
      src: "shared/modules/*.js",
      options: {
        specs: "shared/tests/unit/**.tests.js",
        vendor: "node_modules/**/*.js",
        template: require('grunt-template-jasmine-requirejs')
        }
      }
  };
};

protractor.js看起来是这样的：

module.exports = function(config) {
  return {
       testShared: {
      options: {
        configFile: "shared/tests/unit/config.js"
        }
      }
  };
};

我在这个问题上花了两天时间。我不知道我做错了什么。我觉得我已经在网上学习了这些例子。我觉得有件蠢事我忽略了。有人能告诉我我做错了什么吗？

Answer 1

如果没有运行的示例，很难进行诊断，但是这个错误是由RequireJS引起的。当您没有加载require('something')时，就会发生这种情况。加载是异步的，所以您需要执行require['lodash'], function(_) { do stuff }。或者首选的define语法：

define([
    'lodash'
], function(_) {
    'use strict';

    _.mixin({
        myFunction: function(s) {
            return 'Hello ' + s; 
        }
    });

    return _;
});

使用测试时，您通常会使用与define中测试的模块相同的结构和拉入模块。您将设置它，因此所需文件的路径与应用程序中的路径相同。

为了提供更多帮助，我们需要一个运行示例。

我的同事用咕噜/茉莉/需求做了一个很好的样板，也许你可以从那里得到一些好的实践：https://github.com/mderrick/backbone-boilerplate

您的目录结构很混乱，您考虑过简化它吗？-使用单个Gruntfile.js -除非您的项目很大，否则不要分段

index.html
Gruntfile.js
app/
test/

这就是你真正需要的。在应用程序中，它可能看起来像：

app/app.js <-- entry point
app/modules/...