L'objet ne supporte pas la propriété ou la méthode 'matches' sur Edge

J'utilise gulp et babel pour transcrire ES6 en ES5. Voici mon code:L'objet ne supporte pas la propriété ou la méthode 'matches' sur Edge

gulpfile.babel.js

import gulp from 'gulp'; 
import babel from 'gulp-babel'; 
gulp.src([appDir + 'js/**/*.js', '!' + appDir + 'js/{vendors,vendors/**}']) 
     .pipe(babel({ 
      presets: ['es2015'], 
      plugins: ['transform-runtime'] 
     })) 
     .pipe(gulp.dest(devDir + 'js'));

package.json

"devDependencies": { 
    "babel-core": "*", 
    "babel-plugin-transform-runtime": "*", 
    "babel-preset-es2015": "*", 
    "gulp": "*", 
    "gulp-babel": "*", 
    }

.babelrc

{ 
    "presets": [ 
    "es2015" 
    ], 
    "plugins": ["transform-runtime"] 
}

E Tout fonctionne bien sur tous les navigateurs sauf IE11 et Edge.

IE11 a erreur:

'Symbol' is undefined

bord a erreur:

Object doesn't support property or method 'matches'

J'espère que l'ajout de ce plugin "plugins": ["transform-es2015-typeof-symbol"] dans le fichier .babelrc résoudra le 'Symbole' est le problème indéfini mais pas!

Ai-je besoin de certains paramètres spéciaux ou de transformer le plugin pour babel?

Source

2017-08-04 quarky

Vous avez 'babel-plugin-transform-runtime' dans votre liste de dépendances, mais vous ne l'avez pas activé dans la configuration de Babel. Aussi généralement pas une bonne idée de mettre deux questions en une. Votre problème avec 'matches' est entièrement indépendant de Babel ou Gulp ou ES6. – loganfsmyth

J'ai mis à jour le code, mais j'ai une nouvelle erreur maintenant: ReferenceError: require n'est pas défini – quarky

Avec le processus de construction que vous avez montré, il n'y a rien qui gérera 'import' et' export' correctement. Si vous chargez dans un navigateur avec l'importation/exportation de module, vous devez utiliser Webpack. – loganfsmyth

Vous devrez charger https://cdnjs.com/libraries/babel-polyfill à partir d'un CDN car vous n'utilisez pas de groupe de modules. Je viens de déposer

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

dans votre page avant vos autres fichiers JS.

En ce qui concerne votre erreur à propos de matches, vous aurez à comprendre cela en regardant votre code. Le code utilisant Element#matches ne fonctionnera pas sur les anciennes versions IE car la méthode n'existe pas ou porte un nom différent.

Source

2017-08-04 17:46:33 loganfsmyth

Merci beaucoup, ce polyfill a résolu mon problème. Je crée aussi du polyfill pour les matchs Element. Je pensais que Babel allait aussi résoudre ça pour moi. Pourquoi pour certaines fonctions doit être utilisé polyfill personnalisé? – quarky

Babel transforme la syntaxe de concert, donc le code qui lancerait une erreur de syntaxe est converti en code qui était valide dans la syntaxe ES5. Fournir des fonctionnalités non-syntaxiques est le travail du polyfill. Vous voulez presque toujours les deux. – loganfsmyth

Merci pour l'explication, maintenant je sais enfin pourquoi le polyfill est utilisé pour :) – quarky

L'objet ne supporte pas la propriété ou la méthode 'matches' sur Edge

Répondre

Questions connexes