La funzionalità Babel 6.0.20 Modules non funziona in IE8

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

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

E importalo in index.js :

 import header from "./header.js" $(function () { header.setHeaderHighlight(0); }); 

Quindi la trasformazione esce 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’eccezione Expected identifier su { default: obj } , ma tutto è ok> = ie9.

C’è qualcosa che posso fare con questo?

Per impostazione predefinita, Babel 6.x richiede l’abilitazione di un insieme esplicito di trasformazioni. Il predefinito es2015 standard converte ES6 in ES5, tuttavia IE8 non è compatibile con ES5. In questo caso, se guardi la lista dei plugin , vedrai

  • trasformare-ES3-utente di espressioni letterali
  • trasformare-ES3-proprietà-letterali

Questi convertiranno le tue proprietà in modo che siano compatibili con IE8. Generalmente in Babel 6.x lo faresti passando questi nomi come parte dell’array di plugins , insieme all’array di presets e installando le trasformazioni tramite

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

Io uso webpack + es3ify-loader come soluzione alternativa.

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

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

Anche il modulo in node_modules funziona bene.