Module introuvable: Erreur: impossible de résoudre 'core-js / es6'


112

J'ai un problème avec mon processus de construction en relation avec mon application React.

J'obtiens toujours l'erreur suivante:

Module introuvable: Erreur: impossible de résoudre 'core-js / es6'

si j'utilise ceci dans un polyfill.js:

import 'core-js / es6';

C'est mon package.json:

{
  "name": "test",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "private": true,
  "devDependencies": {
    "@babel/core": "^7.4.0",
    "@babel/preset-env": "^7.4.2",
    "@babel/preset-react": "^7.0.0",
    "@babel/runtime": "^7.4.2",
    "babel-loader": "^8.0.5",
    "babel-preset-es2015": "^6.24.1",
    "copy-webpack-plugin": "^5.0.2",
    "css-hot-loader": "^1.4.4",
    "eslint": "5.15.3",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-loader": "^2.1.2",
    "eslint-plugin-import": "2.16.0",
    "eslint-plugin-jsx-a11y": "6.2.1",
    "eslint-plugin-react": "7.12.4",
    "file-loader": "^3.0.1",
    "node-sass": "^4.11.0",
    "prettier": "^1.16.4",
    "react-hot-loader": "4.8.0",
    "sass-loader": "^7.1.0",
    "webpack": "^4.29.6",
    "webpack-cli": "^3.3.0",
    "webpack-dev-server": "^3.2.1"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "core-js": "^3.0.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.5",
    "react-dom": "^16.8.5",
    "react-redux": "^6.0.1",
    "react-string-replace": "^0.4.1",
    "redux": "^4.0.1",
    "slick-carousel": "^1.8.1"
  },
  "scripts": {
    "dev": "webpack-dev-server --hot",
    "build": "webpack --colors --profile --progress --env.mode production",
    "lint": "eslint ./src/ --ext .js,.jsx"
  }
}

Quelqu'un peut-il aider ici?


2
La même erreur dans l'application angulaire après la version de mise à niveau. Vérifiez si ce dossier (core-js / es6) existe dans vos modules de nœuds.
Kamil Naja

@KamilNaja Je suis confronté au même problème et le dossier (core-js / es6) n'existe pas dans mes node_modules, j'ai (core-js / es) dans mes node_modules. Que faire?
Kunal Tyagi le

Réponses:


154

Les importations ont changé pour core-js version 3.0.1 - par exemple

import 'core-js/es6/array'; et import 'core-js/es7/array';

peut maintenant être fourni simplement par ce qui suit

import 'core-js/es/array';

si vous préférez ne pas intégrer l'ensemble des core-js


18
après avoir migré angulaire vers 8, j'obtenais l'erreur mais votre solution l'a corrigée.
Nakres

8
C'est la solution pour la migration vers angular 8 :) merci
Kris Boyd

Je n'ai rien dans mon code qui commence par import 'core-js/...alors que dois-je changer et où? Utilisation de VueJS 2
volume un

@volumeone exécutez 'npm i core-js' dans votre terminal.
Shivam Shukla

1
@ShivamShukla merci mais j'ai dû passer à la version 2.6.11 pour que cela fonctionne. Il y a un bug entre mini-css-extract-plugin et core-js 3
volume un

98

J'ai trouvé une réponse possible. Vous avez la version 3.0 de core-js , et cette version n'a pas de dossiers séparés pour ES6 et ES7 ; c'est pourquoi l'application ne trouve pas les chemins corrects.

Pour résoudre cette erreur, vous pouvez rétrograder la version core-js vers 2.5.7. Cette version produit une structure de catalogues correcte, avec des dossiers séparés ES6 et ES7 .

Pour rétrograder la version, exécutez simplement:

npm i -S core-js@2.5.7

Dans mon cas, avec Angular, cela fonctionne bien.


1
Merci, c'est au moins une solution. J'ai également trouvé la solution pour utiliser la version 3.0 sans rétrograder. Will post
Gutelaunetyp

Sauveur de vie, au sérieux. Je vous remercie.
IRCraziestTaxi

1
Pouvez-vous expliquer comment la rétrogradation ne casse pas tout le reste et pourquoi vous ne vous contenteriez pas de mettre à jour vers un nouveau format? Vous avez une tonne de votes positifs, ce qui suggère que cela fonctionne bien pour les gens, mais ce n'est certainement pas une bonne solution à long terme.
Simon_Weaver

Ainsi, la solution parfaite consiste à mettre à niveau vos importations chaque fois que vous utilisez core-js pour utiliser la dernière version. Malheureusement, lorsque cette dépendance est utilisée dans une autre bibliothèque, cette solution peut être impossible et vous devez utiliser une solution de contournement.
Kamil Naja

4
-1 Ceci est un pansement pour se débarrasser du message, la rétrogradation de vos paquets n'est pas une bonne pratique à suivre. Les lecteurs sont bien mieux lotis de corriger leurs importations. Non seulement c'est aussi simple sinon plus simple, mais c'est une bien meilleure pratique: stackoverflow.com/a/56186570/610573
Chris Baker

42

Remplacez tous les "es6" et "es7" par "es" dans vos polyfills.ts et polyfills.ts (facultatif).

  • De: import 'core-js/es6/symbol';
  • À: import 'core-js/es/symbol';

21

Après avoir migré vers Angular8 , core-js/es6ou core-js/es7ne fonctionnera pas.

Vous devez simplement remplacer l'importation core-js/es/

Par ex.

import 'core-js/es6/symbol'  

à

import 'core-js/es/symbol'

Cela fonctionnera correctement.


Fonctionne pour moi dans Angular 8!
ihimv

Cela fonctionne pour moi mais je suis toujours très confus. Je croise la source Angular en m'attendant à voir cette nouvelle importation unique - et même l'exemple de 'hello world Ivy' montre toujours les /es6chemins github.com/angular/angular/blob/master/integration/... Une idée pourquoi ils font ça?
Simon_Weaver


4

Bien sûr, j'ai eu un problème similaire et un simple

npm uninstall @babel/polyfill --save &&
npm install @babel/polyfill --save

a fait l'affaire pour moi.

Cependant, l'utilisation de @ babel / polyfill est obsolète (selon ce commentaire ) donc n'essayez ceci que si vous pensez que vous avez des paquets plus anciens installés ou si tout le reste échoue.


1
Mec, tu es un sauveur de vie. Cela m'a rendu fou.
DiederikEE le

4
L'utilisation de @babel/polyfillest obsolète.
Neurotransmetteur

3

Changez simplement "target": "es2015" en "target": "es5" dans votre tsconfig.json.

Travaillez pour moi avec Angular 8.2.XX

Testé sur IE11 et Edge


2

Fini par avoir un fichier nommé polyfill.js dans projectpath \ src \ polyfill.js Ce fichier ne contient que cette ligne: import 'core-js'; ce polyfills non seulement es-6, mais c'est la manière correcte d'utiliser core-js depuis la version 3.0.0.

J'ai ajouté le polyfill.js à mon attribut d'entrée de fichier webpack comme ceci:

entry: ['./src/main.scss', './src/polyfill.js', './src/main.jsx']

Fonctionne parfaitement.

J'ai également trouvé plus d'informations ici: https://github.com/zloirock/core-js/issues/184

L'auteur de la bibliothèque ( zloirock ) affirme:

ES6 modifie le comportement de presque toutes les fonctionnalités ajoutées dans ES5, de sorte que le point d'entrée core-js / es6 les inclut presque toutes. De plus, comme vous l'avez écrit, il est nécessaire pour réparer les implémentations de navigateur défectueuses.

(Citation https://github.com/zloirock/core-js/issues/184 de zloirock)

Donc je pense importer 'core-js'; est très bien.


Pour plus d'informations sur les modules et les espaces de noms à importer, consultez la documentation actuelle de core-js .
Kamafeather

Est-il possible de marquer cela comme la bonne réponse, je pense que c'est plus précis, surtout près d'un an plus tard.
doz87


0

Apportez des modifications à votre fichier Polyfills.ts

Remplacez tous les "es6" et "es7" par "es" dans vos polyfills.ts et polyfills.ts

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.