javascript - Crbug/1173575, file modul non-JS sudah usang. chromewebdata/(index)꞉5305:9:5551

Saya baru saja membuat proyek baru dan telah menjalankannya untuk pertama kali menggunakan F5 atau Ctrl + F5. Hasilnya di Chrome adalah:

Situs tidak dapat dijangkau

err_koneksi_ditolak

Saya mencentang opsi di titik henti untuk "Exceptions caught" dan kesalahan berikut ditampilkan.

Tanpa mencentang "Exceptions caught", kesalahan berikutnya yang muncul:

Saya mencoba menjalankan "ng s -o" dari terminal dan semuanya berfungsi dengan baik. Situs ini bekerja dengan baik di port 4200, tetapi saya suka men-debug.

Berikut adalah file launch.json saya, semuanya secara default:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "pwa-chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

Mengapa ini terjadi?

Jawaban #1

Saya juga mengalami masalah ini dan tidak satu pun dari solusi yang tercantum yang membantu. Namun, masalah ini cukup mudah untuk diselesaikan.

Cukup masuk ke tab Network di Konsol Pengembang Chrome. Pastikan koneksi dalam keadaan No throttling dan bukan Offline.

Jawaban #2

Pesan kesalahan yang menyesatkan ini tampaknya tidak ada hubungannya dengan Chrome atau fungsi yang sudah usang. Ini bisa memiliki banyak penyebab dan tampaknya terjadi setiap kali konektivitas tidak dapat terhubung.

Saya mendapatkan ini saat mengikuti tutorial React untuk Visual Studio Code. Dalam tutorial itu, Anda mulai dengan membuat template menggunakan npx dan kemudian menjalankannya dengan npm start. Itu berhasil, dan saya bisa melihat bahwa itu menggunakan http://localhost:3000 untuk URL di browser.

Namun, ketika saya mengubah kodenya seperti yang diminta oleh tutorial dan menetapkan breakpoint untuk melakukan debug, saya mendapatkan kesalahan seperti yang ada di postingan OP, baik di Chrome maupun di Edge.

Visual Studio Code sedang membuat file launch.json default untuk debugging dan mengisinya seperti ini:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    "version": "0.2.0",
    "configurations": [
        {
            "type": "pwa-chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

Dan saya perlu mengubah 8080 secara manual menjadi 3000 yang memperbaiki masalahnya.

Kunci bagi saya adalah mengonfigurasi breakpoint untuk menangkap pengecualian seperti yang dijelaskan OP (catatan - Anda hanya bisa mengonfigurasi itu dengan ikon Debug yang dipilih di menu ikon paling kiri). Meskipun pesan kesalahan yang dikeluarkan masih yang menyesatkan "deprecated", ada pesan bahwa "site tidak dapat dijangkau" yang dapat Anda temukan jika Anda menggali sedikit - seperti yang ditunjukkan di sini:

Saya membayangkan bahwa hampir semua masalah konfigurasi yang menyebabkan koneksi gagal akan menyebabkan kesalahan ini. Jadi masalah firewall, program host yang hilang, konfigurasi yang buruk (seperti milik saya), dll.

Jawaban #3

Saya mengalami masalah yang sama dan masalahnya ada pada URL. Itu adalah https://localhost:8000; alih-alih http://localhost:8000.

Jadi coba periksa URL dan rute Anda.

Jawaban #4

Server saya memang tidak berjalan secara lokal. :) Menjalankannya di localhost menyelesaikannya.

Jawaban #5

Bagi saya, masalahnya adalah aplikasi React/Next.js tidak berjalan.

Pada dasarnya, kamu harus menjaga aplikasi tetap berjalan di jendela/terminal terpisah agar bisa menempelkan debugger. Ini berbeda dengan aplikasi lain yang langsung dimulai dari konsol debug itu sendiri.

Jawaban #6

Dalam kasus saya, masalahnya terselesaikan dengan menutup browser dan menyusun ulang aplikasi.

Jawaban #7

Alih-alih meluncurkan aplikasi Anda menggunakan opsi "Luncurkan Chrome terhadap localhost", sebaiknya tetapkan nama aplikasi Anda untuk diluncurkan - Terselesaikan.

Lihat gambar terlampir untuk konteks lebih lanjut.

Artikel terkait