Tengo una reactjs
aplicación escrita con los estándares ES6 y la uso webpack
para crearla. Las webpack
cargas de los js
módulos usando babel-loader
. Para ser específico, utilizo las siguientes versiones de paquetes:
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]
Sin embargo, después de construirlo, el IE 10 da el siguiente error 'Symbol' is undefined
. ¿No babel
debería suponerse que define el Symbol
? ¿Existe alguna configuración específica webpack
o babel
debo establecer para que funcione? Utilizo la {stage: 0}
configuración en mi .babelrc
.
Cualquier ayuda será apreciada, ¡Gracias!
Respuestas:
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 .
fuente
babel-polyfill
solucionó este problema para mí. ¡Gracias!Ok, eventualmente descubrí que
babel
solo 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í.fuente
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
fuente
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?
fuente
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
fuente
@babel/plugin-transform-runtime
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';
fuente