Định cấu hình karma.js để làm việc với phản ứng và ES6

Question

Im cố gắng phát triển mô-đun phản ứng với ES6 và không thể tìm thấy bất kỳ trình tạo nào cho điều đó, vì vậy tôi phải thực hiện nó từ cơ bản. Tôi đã có thể cấu hình gần như tất cả mọi thứ, nhưng im có rất nhiều vấn đề cố gắng để cấu hình nghiệp, để kiểm tra mô-đun của tôi.

Đây là karma.conf.js tôi

// Karma configuration 
// http://karma-runner.github.io/0.12/config/configuration-file.html 
// Generated on 2015-03-17 using 
// generator-karma 0.9.0 

module.exports = function(config) { 
    'use strict'; 

    config.set({ 
    // enable/disable watching file and executing tests whenever any file changes 
    autoWatch: true, 

    // base path, that will be used to resolve files and exclude 
    basePath: '../', 

    // testing framework to use (jasmine/mocha/qunit/...) 
    frameworks: ['commonjs', 'mocha', 'chai'], 

    // list of files/patterns to load in the browser 
    files: [ 
     'node_modules/karma-babel-preprocessor/node_modules/babel-core/browser-polyfill.js', 
     'node_modules/react/react.js', 
     'lib/**/*.js', 
     'test/**/*.js' 
    ], 
    preprocessors: { 
     'lib/**/*.cjsx': ['cjsx'], 
     'test/**/*.cjsx': ['cjsx'], 
     'lib/**/*.js': ['babel', 'commonjs'], 
     'test/**/*.js': ['babel', 'commonjs'] 
    }, 
    babelPreprocessor: { 
     options: { 
     sourceMap: 'inline' 
     }, 
     filename: function (file) { 
     return file.originalPath.replace(/\.js$/, '.es5.js'); 
     }, 
     sourceFileName: function (file) { 
     return file.originalPath; 
     } 
    }, 

    // list of files/patterns to exclude 
    exclude: [ 
    ], 

    // web server port 
    port: 8080, 

    // Start these browsers, currently available: 
    // - Chrome 
    // - ChromeCanary 
    // - Firefox 
    // - Opera 
    // - Safari (only Mac) 
    // - PhantomJS 
    // - IE (only Windows) 
    browsers: [ 
     'Chrome', 'PhantomJS' 
    ], 

    // Which plugins to enable 
    plugins: [ 
     'karma-commonjs', 
     'karma-cjsx-preprocessor', 
     'karma-babel-preprocessor', 
     'karma-phantomjs-launcher', 
     'karma-chrome-launcher', 
     'karma-mocha', 
     'karma-chai' 
    ], 

    // Continuous Integration mode 
    // if true, it capture browsers, run tests and exit 
    singleRun: false, 

    colors: true, 

    // level of logging 
    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG 
    logLevel: config.LOG_INFO, 

    // Uncomment the following lines if you are using grunt's server to run the tests 
    // proxies: { 
    // '/': 'http://localhost:9000/' 
    // }, 
    // URL root prevent conflicts with the site root 
    // urlRoot: '_karma_' 
    }); 
}; 

Tại thời điểm này tôi có các lỗi sau

Chrome 42.0.2311 (Mac OS X 10.10.2) ERROR 
    Uncaught ReferenceError: module is not defined 
    at /Users/admin/workspace/open_source/react-component-inspector/node_modules/react/react.js:1 

và nếu tôi loại bỏ các phản ứng ref từ phần file tôi nhận được lỗi này khác

PhantomJS 1.9.8 (Mac OS X) ERROR 
    Uncaught Error: Could not find module 'react' from '/Users/admin/workspace/open_source/react-component-inspector/lib/index.es5.js' 
    at /Users/admin/workspace/open_source/react-component-inspector/node_modules/karma-commonjs/client/commonjs_bridge.js:85 

Và nếu tôi xóa commonJS tôi sẽ nhận được

PhantomJS 1.9.8 (Mac OS X) ERROR 
    ReferenceError: Can't find variable: exports 
    at /Users/admin/workspace/open_source/react-component-inspector/lib/index.es5.js:5 

Hoặc ít nhất bất cứ ai cũng có thể giới thiệu cho tôi một máy phát điện yo với nghiệp, ES6, jsx, để xây dựng mô-đun chứ không phải ứng dụng web?

Thanks for the help

Answer 1

Tôi tin rằng bạn chỉ cần thêm con đường phản ứng của tập tin vào danh sách các file Preprocessor. Điều này là do tệp phản hồi cũng sử dụng định dạng commonjs giống như tệp của ứng dụng và khi tệp đó được tải trong chrome, không giống như nút, trình duyệt không có khái niệm về đối tượng "mô-đun" đến từ đâu. Đã cập nhật đoạn trích từ mã của bạn bên dưới.

 // list of files/patterns to load in the browser 
     files: [ 
      'node_modules/karma-babel-preprocessor/node_modules/babel-core/browser-polyfill.js', 
      'node_modules/react/react.js', 
      'lib/**/*.js', 
      'test/**/*.js' 
     ], 
     preprocessors: { 
      // you can probably leave off babel here. 
      'node_modules/react/react.js': ['babel', 'commonjs'], 
      'lib/**/*.cjsx': ['cjsx'], 
      'test/**/*.cjsx': ['cjsx'], 
      'lib/**/*.js': ['babel', 'commonjs'], 
      'test/**/*.js': ['babel', 'commonjs'] 
     },