Bootstrap mencoba memuat file peta. Bagaimana cara menonaktifkannya? Apakah saya perlu melakukannya?

127

Saya baru-baru ini bermain dengan bootsrap3. Saya mengumpulkannya dari sumber dan memasukkan distr js dan css ke proyek saya. Masalahnya, saya lihat di alat dev GH, bahwa ia mencoba mendapatkan file .map.css. Mengapa ingin melakukannya? Bagaimana cara menonaktifkannya? Apakah saya perlu menonaktifkannya? Agar tidak memiliki tanda kesalahan dalam alat dev, saya menambahkan file peta itu, setelah itu semua gaya ditampilkan seperti yang didefinisikan dalam lebih sedikit file, yang tidak banyak membantu saya.

twitter-bootstrap  twitter-bootstrap-3 
— dhblah
sumber
5
Apakah salah satu jawaban yang diberikan di bawah ini menjawab pertanyaan Anda? Jika tidak, dapatkah Anda memperbarui pertanyaan Anda sehingga kami dapat meningkatkan jawaban kami?
— Dominic Zukiewicz
— oliver-clare

Jawaban:

162

Hapus garis /*# sourceMappingURL=bootstrap.css.map */daribootstrap.css

— pengguna2779632
sumber
38
Mohon jelaskan jawaban Anda secara singkat agar jawaban Anda lebih bermanfaat bagi OP dan pembaca lainnya.
— Mohit Jain
9
Ini berfungsi, tetapi jika bootstrap direferensikan langsung dari node_modules, ketika bootstrap diinstal ulang, ini akan ditimpa kembali
— Alexander
2
Wow! Benar-benar gila ... ini hanya berfungsi jika Anda "menghapus" baris (seperti yang Anda katakan) ... mengomentari masih menghasilkan 404 kesalahan! Senang saya menemukan posting Anda!
— flipflopmedia
120

File .map memungkinkan browser mendownload versi lengkap JS yang diperkecil. Ini benar-benar untuk tujuan debugging.

Akibatnya, .map hilang tidak menjadi masalah. Anda hanya tahu itu hilang, karena peramban telah membuka alat Pengembangnya, mendeteksi file yang diperkecil dan hanya memberi tahu Anda bahwa debugging JS tidak akan sebaik mungkin.

Inilah sebabnya mengapa pustaka seperti jQuery memiliki file lengkap, yang diperkecil, dan peta juga.

Lihat artikel ini untuk penjelasan lengkap tentang file .map :

— Dominic Zukiewicz
sumber
1
Mendownloadnya? Dari mana? Saya berasumsi bahwa file .less tersebut entah bagaimana dikemas di dalam file peta. Dan saat pemuatan halaman, bootrap membuat ulang file-file tersebut dari sebuah paket.
— dhblah
1
Dari direktori yang sama ia mendapatkan .js dari. Ingat itu hanya ketika alat pengembang terbuka, bukan sebagai permintaan biasa.
— Dominic Zukiewicz
Terima kasih atas balasan Anda, tetapi saya tidak memiliki .lessfile dalam proyek saya. Saya hanya menambahkan .cssdan .jsfile dan mapfile itu.
— dhblah
1
@Raymond: Alat pengembang tidak memahami nama file seperti .min.css - bagaimanapun juga - dapatkah kami menjamin apakah itu diminimalkan? Tidak .. itu akan mengunduh .map hanya untuk memastikan kedua salinannya tersedia. Sekali lagi, ini diaktifkan dengan alat pengembang. Jika Anda menutup jendela alat, itu tidak akan diminta.
— Dominic Zukiewicz
3
Untuk mengulangi, file .map hanya diminta dan digunakan hanya ketika alat dev terbuka, jadi jika tidak ada, Anda tidak akan mendapatkan permintaan tambahan yang gagal saat pengguna biasa membuka halaman Anda.
— tomf
17

Hapus baris "/*# sourceMappingURL=bootstrap.min.css.map */ "di file berikut.

  • css / bootstrap.min.css
  • css / bootstrap.css

Untuk mengambil jalur file di Linux gunakan perintah find / -name "\*bootstrap\*"

— Avinash Kancharla
sumber
File peta sumber, seperti bootstrap.min.css.map, dibuat secara otomatis selama proses minifikasi / kompilasi file. Mereka sebenarnya tidak diperlukan untuk produksi, tetapi pada saat yang sama menempati ruang disk 3 kali lebih banyak daripada yang mereka petakan. Itu sebabnya kami tidak menyertakan mereka dalam rilis. Jika Anda hanya ingin menghapus pesan itu, Anda dapat menghapus komentar seperti / * # sourceMappingURL = bootstrap.min.css.map * / di bootstrap.min.css, bootstrap.min.js dan popper.min.js atau unduh sumber memetakan file dari rilis Bootstrap 4.1.3 dan meletakkannya di dalam direktori libs.
— Ajay Takur
17

Ini hanya terjadi ketika Anda menggunakan dev-tools, dan tidak akan terjadi untuk pengguna biasa yang mengakses server produksi.

Bagaimanapun, saya merasa berguna untuk menonaktifkan perilaku ini di dev-tools : buka pengaturan dan hapus centang opsi "Aktifkan peta sumber".

Tidak akan ada lagi upaya untuk mengakses file peta.

— Shovalt
sumber
Saya pikir ini mungkin jawaban yang paling relevan. Yang lainnya hanya relevan jika disebutkan file sebagai paket dengan aplikasi Anda - yang tidak selalu terjadi.
— Lukino
6

Jika Anda tidak memiliki file .map yang benar dan Anda tidak ingin mengedit baris di bootstrap.css, Anda dapat membuat file .map tiruan.

Dalam kasus saya, saya melihat kesalahan:

GET /bootstrap.css.map not found.

Jadi saya membuat bootstrap.css.map kosong di direktori / public dan kesalahan berhenti.

— Julian Mann
sumber
1
Tidak berfungsi dengan boweratau sesuatu seperti itu karena dalam mode produksi akan menginstal bootstrap dari sumbernya. Sama untuk jawaban apa pun yang mengatakan untuk menghapus garis /*# sourceMappingURL=bootstrap.css.map */.
— monteirobrena
4

Hapus / * # sourceMappingURL = bootstrap.min.css.map * / di css / bootstrap.min.css

dan hapus / * # sourceMappingURL = bootstrap.css.map * / di css / bootstrap.css

— Sergio Perez
sumber
1

Dari bootstrap.css hapus hapus baris terakhir / * # sourceMappingURL = bootstrap-theme.css.map * /

— Saineshwar
sumber
1

Saya juga memiliki peringatan di Google Dev-Tools dan saya hanya menambahkan file bootstrap.min.css.map di folder yang sama, di mana bootstrap.min.css berada.

Saya sekarang tidak memiliki peringatan lagi dan Anda dapat menemukan Penjelasan lebih lanjut di sini: https://github.com/twbs/bootstrap#whats-included

Saya harap, saya menjawab Pertanyaan Anda.

— SVANSKI
sumber
1

Bagi saya, buat bootstrap.css.map kosong bersama dengan bootstrap.css dan kesalahan berhenti.

— fw0213
sumber
1

Menghapus baris ini akan memperbaikinya, tetapi masalahnya adalah file boostrap ada bower_componentsdan tidak diperiksa ke dalam kontrol sumber.

Jadi, setiap pengembang di tim akan mendapatkan file css dengan referensi peta saat mereka menarik repo dan melakukan bower install(yang merupakan bagian dari penggunaan repo baru).

File tidak boleh memiliki referensi ke peta yang tidak ada.

— Steve
sumber
1

Oke Baru-baru ini saya menghadapi masalah ini, saya memiliki solusi yang sangat sederhana untuk mengatasi masalah ini, ikuti langkah-langkah ini: buka direktori ini src-> app-> index.html buka index.html dan temukan <base href="your app name ">ubah ini menjadi<base href="https://stackoverflow.com/">

— Sachin dari Pune
sumber
0

Hapus baris terakhir di bootstrap.css

folllowing lin / * # sourceMappingURL = bootstrap.css.map * /

— pengguna1498608
sumber
coba jelaskan masalah dan bagaimana jawaban Anda mendapatkan solusi, praktik baiknya yang memungkinkan pengguna baru mempelajari apa yang telah terjadi
— Pankaj Nimgade
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.