'Símbolo' no está definido en IE después de usar babel

Tengo una reactjsaplicación escrita con los estándares ES6 y la uso webpackpara crearla. Las webpackcargas de los jsmódulos usando babel-loader. Para ser específico, utilizo las siguientes versiones de paquetes: ├── babel@5.8.34 ├── babel-core@5.8.34 ├── babel-loader@5.4.0 └── webpack@1.12.6

Sin embargo, después de construirlo, el IE 10 da el siguiente error 'Symbol' is undefined. ¿No babeldebería suponerse que define el Symbol? ¿Existe alguna configuración específica webpacko babeldebo establecer para que funcione? Utilizo la {stage: 0}configuración en mi .babelrc.

Cualquier ayuda será apreciada, ¡Gracias!

Puede requerir polyfill en el punto de entrada a su código para que se agrupe con el resto de JavaScript.

Una opción es usar:

require('babel-polyfill');

O:

import 'babel-polyfill';

Todo eso se explica en la documentación .

Ok, eventualmente descubrí que babelsolo no hace polyfill. Incluir el script <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser-polyfill.min.js"></script>resolvió este problema para mí.

Esta solución funcionará con seguridad, funcionó para mí cuando encontré el error: 'Símbolo' no está definido en IE. Funcionó anteriormente en Chrome y Firefox, pero IE arrojaba este error. Me tomó algunas horas encontrar esta solución. Estoy usando el último React en este momento reaccionar "react": "^ 16.5.0" en la máquina de Windows.

1. Install babel-polyfill
npm install --save-dev babel-polyfill
In package.json, it should have the following entries

"devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.2",
    "babel-polyfill": "^6.26.0",
    "babel-preset-react": "^6.24.1"
  }

2. In index.js, add

    import babelPolyfill from 'babel-polyfill';

El problema debería resolverse

De acuerdo, tuve el mismo problema, pero en mi caso fue bastante diferente, así que básicamente necesitas incluir un script en el archivo de índice como se muestra a continuación:

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser-polyfill.min.js"></script>

Pero en mi caso ya lo incluí, luego de algunas investigaciones descubrí que mi proxy bloqueaba el script ...

Así que asegúrese de incluirlo en index.html y también asegúrese tener acceso al script desde donde lo necesita para evitar que ocurra el error ... la mejor manera es simplemente copiar y pegar la URL en el navegador ...

Pero ahora que llegamos a este punto, no se trata del símbolo en sí, ¿qué símbolo no se puede reconocer en IE?

La función Symbol () devuelve un valor de tipo símbolo, tiene propiedades estáticas que exponen varios miembros de objetos incorporados, tiene métodos estáticos que exponen el registro de símbolos global y se asemeja a una clase de objeto incorporada, pero está incompleta como constructor porque no admite la sintaxis "new Symbol ()".

Cada valor de símbolo devuelto por Symbol () es único. Se puede utilizar un valor de símbolo como identificador de propiedades de objeto; este es el único propósito del tipo de datos. Puede encontrar más explicaciones sobre el propósito y el uso en la entrada del glosario de Symbol.

El símbolo del tipo de datos es un tipo de datos primitivo.

en la documentación sobre Runtime

// in bash
npm install babel-transform-runtime --save-dev

// in gulpfile
.pipe(babel({
  plugins: ['transform-runtime']
}))

editar: mejor aún en heroku en modo prod use --save en lugar de --save-dev

Si recibe este error en una aplicación angular, debe eliminar los comentarios de las siguientes líneas en polyfills.ts:

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';