Rumah >hujung hadapan web >tutorial js >Bagaimana untuk menyelesaikan masalah ralat import es6

Bagaimana untuk menyelesaikan masalah ralat import es6

藏色散人
藏色散人asal
2021-09-03 17:04:133433semak imbas

Penyelesaian kepada ralat import es6: 1. Gunakan bebal untuk menukar es6 kepada es5 2. Pek melalui webpack, gabungkan semua dependensi ke dalam satu fail, dan kemudian gunakan babel untuk menukar.

Bagaimana untuk menyelesaikan masalah ralat import es6

Persekitaran pengendalian artikel ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

Bagaimana untuk menyelesaikan masalah ralat import es6?

Kebanyakan penyemak imbas kini tidak menyokong ES6, jadi apabila menggunakan es6, anda perlu menggunakan bebal untuk menukar es6 kepada es5 .

Direktori projek:

  • demo1: Penukaran satu fail js

test1.js di bawah fail src

const aa="this is test1";
console.log("this is from test1",aa);\

Perkenalkan fail bebal dalam direktori akar projek

.babel

Kandungan:

{
  presets:["es2015"]
}

Pasang babel -cli

cnpm i babel-cli -g

Oleh kerana anda ingin menukar es6 kepada es5, anda juga perlu memasang babel-preset-es2015

cnpm i babel-preset-es2015 --save-dev

convert test1.js

babel src --out-dir dist

(letakkan direktori src Tukar fail js kepada es5 dan letakkan di bawah fail dist)

Halaman memperkenalkan test1.js di bawah dist Tiada ralat akan dilaporkan semasa menjalankan

  • demo2: Berbilang projek fail diperkenalkan dan Tukar

fail src:

test2.js

const bb="this is bb";
export {bb}

test3.js

import {bb} from 'test2.js'
console.log(bb);

Tukar babel src --out-dir dist

Halaman memperkenalkan test2.js test3.js di bawah fail dist

Ralat laporkan

Bagaimana untuk menyelesaikan masalah ralat import es6

Memandangkan kami menyusun ES6 ke dalam es5 melalui nod;, modul nod adalah berdasarkan spesifikasi CommonJS, dan penyemak imbas dan nod semasa tidak menyokong kebanyakan ES6

Penyelesaian

Anda boleh membungkusnya melalui webpack, menggabungkan semua kebergantungan ke dalam satu fail, gunakan babel untuk menukarnya dan kemudian memperkenalkannya ke dalam fail html

Kajian yang disyorkan: "Tutorial Asas JavaScript"

Atas ialah kandungan terperinci Bagaimana untuk menyelesaikan masalah ralat import es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn