Babel 6.0.20 I moduli non geometria di lavoro in IE8

Question

Sto cercando di esportare un modulo ES6 in header.js:

export default { 
    setHeaderHighlight: function (index) { 
     // do somethings 
    } 
}; 

e importarlo in index.js:

import header from "./header.js" 

$(function() { 
    header.setHeaderHighlight(0); 
}); 

Poi trasformazione viene fuori in index.bundle.js :

var _header = __webpack_require__(129); 

var _header2 = _interopRequireDefault(_header); 

function _interopRequireDefault(obj) { 
    return obj && obj.__esModule ? obj : { default: obj }; // crash here 
} 

Quindi ecco il problema, ie8 salirà un Expected identifier Eccezione allo { default: obj }, ma tutto è ok> = ie9.

C'è qualcosa che posso fare con questo?

Answer 1

Per impostazione predefinita, Babel 6.x richiede l'abilitazione di un insieme esplicito di trasformazioni. La preimpostazione standard es2015 converte ES6 in ES5, tuttavia IE8 non è compatibile ES5. In questo caso, se si guarda alla plugins list, si vedrà

• transform-es3-member-expression-literals
• transform-es3-property-literals

Questi saranno convertire le vostre proprietà per essere compatibile con IE8. In generale, in Babel 6.x faresti questo passando quei nomi come parte del vostro plugins array, a fianco la matrice presets e installare le trasformate tramite

npm install --save-dev babel-plugin-transform-es3-member-expression-literals babel-plugin-transform-es3-property-literals 

Answer 2

Io uso webpack + es3ify-loader come soluzione alternativa.

loaders: { 
    { 
    test: /\.jsx?$/, 
    exclude: /node_modules/, 
    loaders: ['es3ify', `babel?${JSON.stringify(babelQuery)}`], 
    }, 
} 

Answer 3

Ho anche il problema, e ho scritto a webpack plugin per risolverlo. Non sapevo davvero se c'è un modo migliore per gestirlo, ma funziona.

Anche il modulo in node_modules funziona correttamente.