web-dev-qa-db-fra.com

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

J'ai un problème avec mon processus de construction par rapport à mon React app.

J'obtiens toujours l'erreur suivante:

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

si j'utilise ceci dans un polyfill.js:

importez '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?

npmbuildyarnpkgpackage.json
96
Gutelaunetyp

A fini par avoir un fichier nommé polyfill.js dans projectpath\src\polyfill.js Ce fichier contient uniquement cette ligne: import 'core-js'; ce polyfills non seulement es-6, mais est la bonne façon 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. En outre, comme vous l'avez écrit, il est nécessaire pour réparer les implémentations de navigateur cassées.

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

Je pense donc que importer 'core-js'; est très bien.

1
Gutelaunetyp

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 les éléments suivants

import 'core-js/es/array';

si vous préférez ne pas apporter la totalité des core-js

124
LeaveTheCapital

J'ai trouvé une réponse possible. Vous avez core-js version 3.0, 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 ES6 et ES7 séparés.

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

npm i -S [email protected]

Dans mon cas, avec Angular, cela fonctionne bien.

81
Kamil Naja

Changez tous les "es6" et "es7" en "es" dans vos polyfills.ts et polyfills.ts (facultatif).

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

Après la migration vers Angular 8, 'core-js/es6' ou 'core-js/es7' ne fonctionnera pas.

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

Par exemple. importer 'core-js/es6/symbol' pour importer 'core-js/es/symbol'

Cela fonctionnera correctement.

16
Bhadresh Patel

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 déconseillée (selon ce commentaire ), donc n'essayez ceci que si vous pensez que des packages plus anciens sont installés ou si tout le reste échoue.

4
otech47

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

Travaillez pour moi avec Angular 8.2.XX

Testé sur IE11 et Edge

3
jspassov