业力单元测试：尚未为上下文_加载模块名称“ react”使用require[]

如何解决业力单元测试：尚未为上下文_加载模块名称“ react”使用require[]

当您require以Commonjs形式（require('modX')）而不是AMD形式（require(['modX'], function (modX) {...})）进行调用时，您所描述的错误正是RequireJS给您的， 调用没有被封装进来define。RequireJS为使用Commonjs表单提供了一些支持，但是开发人员必须做最少的工作才能确保它能正常工作。以此开头的脚本将不起作用：

var modX = require('modX');
// rest of the module

您收到错误消息。您需要此：

define(function (require) {
    var modX = require('modX');
    // rest of the module
});

设置的实际情况是，Babel正在将ES6模块转换为require无需define包装即可使用的模块。为了使Babel输出正确的AMD模块，您需要安装babel- plugin-transform-es2015-modules-amd并添加transform-es2015-modules- amd到Babel插件列表中。请参阅此处的文档。

解决方法

我正在尝试建立反应的单元测试框架。这样做时，发生以下错误。我搜索了整个互联网，但没有有效的解决方案。下面是显示的错误和我正在使用的代码/软件包。

调试错误

04 03 2016 04:48:46.340:DEBUG [phantomjs.launcher]: Error: Module name "react" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded


04 03 2016 04:48:46.341:DEBUG [phantomjs.launcher]:   http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:140 in defaultOnError
  http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:544 in onError
  http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:1429 in localRequire
  http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:1791 in requirejs

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  Error: Module name "react" has not been loaded yet for context: _. Use require([])
  http://requirejs.org/docs/errors.html#notloaded
  at /Users/lebeier/Documents/iMARS/node_modules/requirejs/require.js:140
PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 0 of 0 ERROR (0.053 secs / 0 secs)

节点包

  "dependencies": {
    "bootstrap": "^3.3.6","highcharts": "^4.2.1","history": "^1.17.0","jquery": "^2.2.0","js-cookie": "^2.1.0","react": "^0.14.6","react-bootstrap": "^0.28.2","react-bootstrap-table": "^1.4.5","react-data-components": "^0.6.0","react-dom": "^0.14.6","react-highcharts": "^6.0.0","react-notification-system": "^0.2.6","react-router": "^1.0.3","reactify": "^1.1.1","toastr": "^2.1.2"
  },"devDependencies": {
    "babel-core": "^6.6.4","babel-loader": "^6.2.4","babel-preset-es2015": "^6.3.13","babel-preset-react": "^6.3.13","babel-preset-stage-0": "^6.5.0","babelify": "^7.2.0","browserify": "^13.0.0","core-js": "^2.1.3","grunt-template-jasmine-requirejs": "^0.2.3","jasmine": "^2.4.1","karma": "^0.13.21","karma-babel-preprocessor": "^6.0.1","karma-browserify": "^5.0.2","karma-cli": "^0.1.2","karma-coverage": "^0.5.4","karma-jasmine": "^0.3.7","karma-phantomjs-launcher": "^1.0.0","karma-requirejs": "^0.2.5","karma-webpack": "^1.7.0","node-sass": "^3.4.2","phantomjs-prebuilt": "^2.1.4","requirejs": "^2.1.22","uglify": "^0.1.5","watchify": "^3.7.0","webpack": "^1.12.14"
  }

karma.conf.js

module.exports = function(config) {
  config.set({

  // base path that will be used to resolve all patterns (eg. files,exclude)
  basePath: '',// frameworks to use
  // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
  frameworks: ['jasmine','requirejs'],// list of files / patterns to load in the browser
  files: [
      'tests/*.js'
      //{ pattern: 'tests.webpack.js',watched: false },],// list of files to exclude
  //exclude: [
  //  './node_modules/'
  //],plugins: [
    'karma-jasmine','karma-requirejs','karma-phantomjs-launcher','karma-babel-preprocessor','karma-coverage','karma-browserify','karma-webpack'
  ],// preprocess matching files before serving them to the browser
  // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
  preprocessors: {
    'core/static/core/js/*.js' : ['babel'],'tests/*.js' : ['babel'],'tests.webpack.js': [ 'webpack']
  },babelPreprocessor:{
    options: {
        presets: ['es2015','react'],plugins: ["transform-object-rest-spread"],sourceMap: 'inline'
    },filename: function(file){
        return file.originalPath.replace(/\.js$/,'.es5.js');
    },sourceFileName: function(file){
        return file.originalPath;
    }
  },// test results reporter to use
  // possible values: 'dots','progress'
  // available reporters: https://npmjs.org/browse/keyword/karma-reporter
  reporters: ['dots'],// web server port
  port: 9876,// enable / disable colors in the output (reporters and logs)
  colors: true,// level of logging
  // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
  logLevel: config.LOG_DEBUG,// enable / disable watching file and executing tests whenever any file changes
  autoWatch: true,// start these browsers
  // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
  browsers: ['PhantomJS'],// Continuous Integration mode
  // if true,Karma captures browsers,runs the tests and exits
  singleRun: true,// Concurrency level
  // how many browser should be started simultaneous
  concurrency: Infinity,webpack: {
    devtool: 'inline-source-map',modules: {
        loaders: [
            {
                test: /\.js$/,exclude: /node_modules/,loader: 'babel-loader',query:{
                    presets: ['es2015','react']
                }
            }
        ],},watch: true,webpackServer: {
      noInfo: true,}
  })
}

测试/ test.js

import React from 'react';
import ReactDOM from 'react-dom';

describe('Testing',()=>{
    it('sample test',()=>{
        var v = 2;
        var parts = ['shoulders','knees'];
        var lyrics = ['head',...parts,'and','toes'];
        expect(v).toEqual(2); 
    }); 
});

非常感谢您的帮助！