ไม่พบโมดูล: ข้อผิดพลาด: ไม่สามารถแก้ไข 'core-js / es6'


115

ฉันมีปัญหากับกระบวนการสร้างที่เกี่ยวข้องกับแอป React ของฉัน

ฉันมักจะได้รับข้อผิดพลาดต่อไปนี้:

ไม่พบโมดูล: ข้อผิดพลาด: ไม่สามารถแก้ไข 'core-js / es6'

ถ้าฉันใช้สิ่งนี้ใน polyfill.js:

นำเข้า 'core-js / es6';

นั่นคือ 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"
  }
}

ใครสามารถช่วยที่นี่?


2
ข้อผิดพลาดเดียวกันในแอปเชิงมุมหลังเวอร์ชันอัปเกรด ตรวจสอบว่ามีโฟลเดอร์นี้ (core-js / es6) อยู่ในโมดูลโหนดของคุณหรือไม่
Kamil Naja

@KamilNaja ฉันกำลังประสบปัญหาเดียวกันและไม่มีโฟลเดอร์ (core-js / es6) ใน node_modules ของฉันฉันมี (core-js / es) ใน node_modules ของฉัน จะทำอย่างไร?
Kunal Tyagi

คำตอบ:


157

การนำเข้ามีการเปลี่ยนแปลงสำหรับ core-js เวอร์ชัน 3.0.1 - ตัวอย่างเช่น

import 'core-js/es6/array'; และ import 'core-js/es7/array';

สามารถให้บริการได้ง่ายๆดังนี้

import 'core-js/es/array';

หากคุณไม่ต้องการนำ core-js ทั้งหมดเข้ามา


19
หลังจากโยกย้ายเชิงมุมเป็น 8 ฉันได้รับข้อผิดพลาด แต่โซลูชันของคุณแก้ไขได้
Nakres

9
นี่คือทางออกสำหรับการย้ายไปยังเชิงมุม 8 :) ขอบคุณ
Kris Boyd

ฉันไม่มีอะไรในรหัสของฉันที่ขึ้นต้นด้วยimport 'core-js/...ฉันควรเปลี่ยนอะไรและที่ไหน ใช้ VueJS 2
Volume one

@volumeone รัน 'npm i core-js' ในเทอร์มินัลของคุณ
Shivam Shukla

1
@ShivamShukla ขอบคุณ แต่ฉันต้องปรับลดรุ่นเป็น 2.6.11 เพื่อให้ใช้งานได้ มีข้อผิดพลาดระหว่าง mini-css-extract-plugin และ core-js 3
Volume one

99

ฉันพบคำตอบที่เป็นไปได้ คุณมีcore-jsเวอร์ชัน 3.0 และเวอร์ชันนี้ไม่มีโฟลเดอร์แยกต่างหากสำหรับES6และES7 ; นั่นเป็นสาเหตุที่แอปพลิเคชันไม่พบเส้นทางที่ถูกต้อง

ในการแก้ไขข้อผิดพลาดนี้คุณสามารถดาวน์เกรดเวอร์ชันcore-jsเป็น 2.5.7 เวอร์ชันนี้สร้างโครงสร้างแค็ตตาล็อกที่ถูกต้องโดยแยกES6และES7โฟลเดอร์

ในการดาวน์เกรดเวอร์ชันเพียงเรียกใช้:

npm i -S core-js@2.5.7

ในกรณีของฉันกับ Angular มันก็ใช้ได้


1
ขอบคุณนั่นเป็นวิธีแก้ปัญหาอย่างน้อย ฉันยังพบวิธีแก้ปัญหาเพื่อใช้เวอร์ชัน 3.0 โดยไม่ต้องดาวน์เกรด จะโพสต์
Gutelaunetyp

ประหยัดชีวิตอย่างจริงจัง ขอบคุณ.
IRCraziestTaxi

1
คุณช่วยอธิบายได้ไหมว่าการดาวน์เกรดไม่ได้ทำลายอย่างอื่นและทำไมคุณถึงไม่อัปเดตเป็นรูปแบบใหม่ คุณมีคะแนนโหวตเพิ่มขึ้นมากมายซึ่งชี้ให้เห็นว่าสิ่งนี้ใช้ได้ดีสำหรับผู้คน แต่แน่นอนว่านี่ไม่ใช่วิธีแก้ปัญหาระยะยาวที่ดี
Simon_Weaver

ดังนั้นโซลูชันที่สมบูรณ์แบบคืออัปเกรดการนำเข้าทุกครั้งที่คุณใช้ core-js เพื่อใช้เวอร์ชันใหม่ล่าสุด น่าเสียดายที่เมื่อใช้การอ้างอิงนี้ในไลบรารีอื่นการแก้ปัญหานี้อาจเป็นไปไม่ได้และคุณต้องใช้วิธีแก้ปัญหาชั่วคราว
Kamil Naja

4
-1 นี่เป็นตัวช่วยในการกำจัดข้อความการลดระดับแพ็คเกจของคุณไม่ใช่แนวทางปฏิบัติที่ดีในการเข้าถึง ผู้อ่านจะดีกว่ามากในการแก้ไขการนำเข้า ไม่เพียง แต่จะง่ายเหมือนเดิมหากไม่ง่ายกว่านั้นยังเป็นการฝึกฝนที่ดีกว่าอีกมาก: stackoverflow.com/a/56186570/610573
Chris Baker

42

เปลี่ยน "es6" และ "es7" เป็น "es" ทั้งหมดใน polyfills.ts และ polyfills.ts (ไม่บังคับ)

  • จาก: import 'core-js/es6/symbol';
  • ถึง: import 'core-js/es/symbol';

24

หลังจากอพยพไปAngular8 , core-js/es6หรือcore-js/es7จะไม่ทำงาน

คุณต้องเปลี่ยนการนำเข้า core-js/es/

สำหรับอดีต

import 'core-js/es6/symbol'  

ถึง

import 'core-js/es/symbol'

สิ่งนี้จะทำงานได้อย่างถูกต้อง


ใช้ได้ผลกับฉันใน Angular 8!
ihimv

สิ่งนี้ใช้ได้กับฉัน แต่ฉันก็ยังสับสนสุด ๆ ฉันข้ามอ้างอิงกับแหล่งเชิงมุมคาดหวังว่าจะเห็นนี้นำเข้าเพียงครั้งเดียวใหม่ - และแม้กระทั่ง 'Hello World Ivy' ตัวอย่างยังคงแสดงให้เห็น/es6เส้นทางgithub.com/angular/angular/blob/master/integration/...ความคิดว่าทำไมพวกเขากำลังทำอย่างนั้น?
Simon_Weaver

รายละเอียดเพิ่มเติมในฉบับ: github.com/angular/angular/issues/32228
Constantin Konstantinidis

คุณคือผู้ช่วยชีวิต!
UI_Dev

4

แน่นอนฉันมีปัญหาที่คล้ายกันและเป็นเรื่องง่าย

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

ทำเคล็ดลับให้ฉัน

อย่างไรก็ตามการใช้งาน @ babel / polyfill นั้นเลิกใช้แล้ว (ตามความคิดเห็นนี้ ) ดังนั้นให้ลองทำเฉพาะเมื่อคุณคิดว่าคุณติดตั้งแพ็คเกจรุ่นเก่าหรือหากทุกอย่างล้มเหลว


1
คุณคือผู้ช่วยชีวิต มันทำให้ฉันบ้าคลั่ง
DiederikEn

4
การใช้งานของ@babel/polyfillเลิก
Neurotransmitter

3

ลงเอยด้วยไฟล์ชื่อ polyfill.js ในprojectpath \ src \ polyfill.js ไฟล์นั้นมีเฉพาะบรรทัดนี้เท่านั้น: import 'core-js'; polyfills นี้ไม่เพียง แต่ es-6 แต่เป็นวิธีที่ถูกต้องในการใช้ core-js ตั้งแต่เวอร์ชัน 3.0.0

ฉันเพิ่มpolyfill.jsลงในแอตทริบิวต์รายการไฟล์ webpack ของฉันดังนี้:

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

ทำงานได้อย่างสมบูรณ์

ฉันพบข้อมูลเพิ่มเติมที่นี่: https://github.com/zloirock/core-js/issues/184

ผู้เขียนห้องสมุด ( zloirock ) อ้างว่า:

ES6 เปลี่ยนพฤติกรรมเกือบทุกคุณสมบัติที่เพิ่มใน ES5 ดังนั้นจุดเริ่มต้นของ core-js / es6 จึงมีคุณสมบัติเกือบทั้งหมด นอกจากนี้ตามที่คุณเขียนไว้จำเป็นสำหรับการแก้ไขการใช้งานเบราว์เซอร์ที่ใช้งานไม่ได้

(ใบเสนอราคาhttps://github.com/zloirock/core-js/issues/184จาก zloirock)

ดังนั้นฉันคิดว่านำเข้า 'core-js'; เป็นเรื่องปกติ


สำหรับข้อมูลเพิ่มเติมเกี่ยวกับโมดูลและ namespaces จะนำเข้าตรวจสอบแกน jsเอกสารปัจจุบัน
Kamafeather

เป็นไปได้หรือไม่ที่จะทำเครื่องหมายว่าเป็นคำตอบที่ถูกต้องฉันคิดว่านี่ถูกต้องมากกว่าโดยเฉพาะเกือบหนึ่งปีต่อมา
doz87

3

เพียงแค่เปลี่ยน "target": "es2015" เป็น "target": "es5" ใน tsconfig.json ของคุณ

ทำงานให้ฉันด้วย Angular 8.2.XX

ทดสอบบน IE11 และ Edge


3

ถ้าคุณใช้@babel/preset-envและuseBuiltInsแล้วคุณก็ต้องเพิ่มcorejs: 3ข้างตัวเลือก useBuiltIns corejs: 2การระบุรุ่นที่จะใช้ค่าเริ่มต้นคือ

presets: [
  [
    "@babel/preset-env", {
      "useBuiltIns": "usage",
      "corejs": 3
    }
  ]
],

ดูรายละเอียดเพิ่มเติมได้ที่: https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future .md # babelpreset-env


โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.