बेबेल [कर्म-बेबेल-प्रीप्रोसेसर] वर्मा टेस्ट

Question

के लिए ES6-> ES5 को परिवर्तित नहीं किया गया हमने कर्म स्थापित किया है, जो परीक्षण के लिए मोचा और चाई का उपयोग कर रहा है। हम ईएस 5 फाइलों को ईएस 5 में परिवर्तित करने के लिए कर्म-बेबेल-प्रीप्रोसेसर का उपयोग कर सीधे कर्म में बेबेल को एकीकृत करने की कोशिश कर रहे हैं। मोचा का प्रयोग व्यक्तिगत रूप से बेबेल के साथ काम करता है, यानी एक मोचा टेस्ट कमांड, लेकिन हम कर्म का उपयोग करने की कोशिश करते हैं बल्कि यह काम नहीं करता है।

karma.conf.js स्निपेट:

frameworks: ['mocha', 'chai'], 

// preprocess matching files before serving them to the browser 
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor 
preprocessors: { 
    'src/**/*.js': ['babel'], 
    'test/**/*_spec.js': ['babel'] 
}, 

"babelPreprocessor": { 
    options: { 
     presets: ['es2015'], 
     sourceMap: 'inline' 
    }, 
    filename: function(file) { 
     return file.originalPath.replace(/\.js$/, '.es5.js'); 
    }, 
    sourceFileName: function(file) { 
     return file.originalPath; 
    } 
}, 

// list of files/patterns to load in the browser 
files: [ 
    'src/**/*.js', 
    'test/**/*_spec.js' 
], 

package.json स्निपेट:

"scripts": { 
    "test": "./node_modules/karma/bin/karma start karma.conf.js" 
}, 

"babel": { 
    "presets": ["es2015"] 
}, 

"devDependencies": { 
    "babel-preset-es2015": "^6.1.18", 
    "chai": "^3.4.1", 
    "karma": "^0.13.15", 
    "karma-babel-preprocessor": "^6.0.1", 
    "karma-chai": "^0.1.0", 
    "karma-mocha": "^0.2.1", 
    "karma-phantomjs-launcher": "^0.2.1", 
    "phantomjs": "^1.9.18", 
    "redux": "^3.0.4" 
} 

हम निम्नलिखित त्रुटि मिलती है:

PhantomJS 1.9.8 (Mac OS X 0.0.0) ERROR 
    ReferenceError: Can't find variable: exports 
    at Users/alexgurr/BT/FutureVoice/trunk/Portal/server/src/login.es5.js:3 

जब हम का मूल्यांकन किया जा रहा है जे एस फ़ाइलें लोड किया गया है, उन्हें ES5 में परिवर्तित नहीं किया गया है, इसलिए वाक्यविन्यास 'निर्यात' अभी भी मौजूद है।

हम रूपांतरण के लिए किसी भी अन्य ढांचे का उपयोग नहीं करना चाहते हैं, यानी। वेबपैक, ब्राउज़र आदि।

धन्यवाद!

Answer 1

मुझे लगता है कि आपको अभी भी प्रीसेट नहीं बल्कि बेबेल की आवश्यकता है।

npm i babel --save-dev

मैं अपने प्रोजेक्ट में से एक पर लगभग एक ही विन्यास है, मक्खी पर दे कर्म पूर्व प्रक्रिया मेरी फाइल अर्थ, और मेरे लिए फर्क सिर्फ इतना है कि मैं babeljs स्थापित किया है भी है।

उम्मीद है कि इससे मदद मिलती है।

चीयर्स

Answer 2

मैं एक ही मुद्दे के साथ पिछले कुछ घंटों के लिए संघर्ष कर रहा है। मुझे यकीन नहीं है कि आपका उपयोग मामला मेरे जैसा ही है, लेकिन आखिर में मैंने इसे समझ लिया।

परीक्षण src/foo.js तहत

कोड:

var foo = "foo value"; 
export default foo; 

टेस्ट कोड tests/foo.spec.js:

import foo from "../src/foo.js"; 
describe('Foo', function() { 
    it('should be "foo value"', function() { 
     expect(foo).toBe('foo value'); 
    }); 
}); 

karma.conf.js फ़ाइल से पहले:

{ 
    // other configs 
    files: [ 
     'src/**/*.js', 
     'tests/**/*.spec.js', 
    ], 
    preprocessors: { 
     'src/**/*.js': ['babel'], 
     'tests/**/*.spec.js': ['babel'], 
    }, 

    babelPreprocessor: { 
     options: { 
      "presets": ["es2015"] 
     } 
    } 
} 

यह ReferenceError: Can't find variable: exports त्रुटि आपने देखा सामने आए।

ठीक:

• npm install --save-dev babel-plugin-transform-es2015-modules-umd

• जोड़ें karma.conf.js

  babelPreprocessor: { 
      options: { 
       "presets": ["es2015"], 
       "plugins": ["transform-es2015-modules-umd"] 
      } 
  } 
  

के लिए निम्न तब त्रुटि दूर चला गया।

इसके अलावा, ध्यान दें कि निम्नलिखित export घोषणाएं (which I believe should be correct) काम नहीं करते हैं।

// exports an object 
export default var foo = "something"; 

// exports undefined 
export var bar = "something else"; 

Answer 3

समस्या यह है कि आप अभी भी बंडल नहीं था/अपनी फ़ाइलें लपेट के लिए नहीं ब्राउज़र में CommonJS मॉड्यूल निष्पादित करने के लिए (क्योंकि CommonJS में कोलाहल transpile es2015 मॉड्यूल और CJS नोड के लिए डिफ़ॉल्ट मॉड्यूल प्रणाली है, सक्षम होने के लिए है ब्राउज़र जहां कर्म अपने परीक्षण चलाते हैं)। तो अपने विकल्प हैं:

• उपयोग karma-commonjs wrapperbabelify प्लगइन
• उपयोग webpack बंडलर