Memperbarui Bootstrap ke versi 3 - apa yang harus saya lakukan?

102

Saya baru mengenal Bootstrap dan memiliki versi 2.3.2 yang lebih lama.

Versi 3 telah dirilis. Apakah saya hanya mengganti file CSS dan Javascript jika saya ingin menggunakan versi terbaru?

twitter-bootstrap twitter-bootstrap-3 henry
sumber
Anda mungkin ingin membaca tentang perubahan dan memastikan mereka tidak merusak apa pun yang sudah Anda miliki, tapi ya cukup ganti file
Patsy Issa
Ya, saya hanya ingin memastikan bahwa saya melakukan ini dengan benar. Saya pikir Bootstrap telah menjadi yang terbaik yang pernah ada - luar biasa. Saya ingin menggunakan versi berikutnya. Saya yakin saya sedang membaca di suatu tempat yang dapat menggunakan .less untuk mengelola pembaruan tetapi saya mungkin salah dengan itu.
henry
1
kemungkinan duplikat Menulis Bootstrap Twitter dengan meng-upgrade ke v3
Bass Jobsen
Perhatikan bahwa meskipun dokumen mengatakan semuanya "berubah-ubah" di 3.0, itu masih menggunakan lebar piksel tetap untuk penampung ... yang agak bodoh karena itu kebalikan dari tata letak fluida.
Cerin

Jawaban:

134

  1. Unduh versi terbaru dari http://getbootstrap.com/ ATAU Ganti file css dan js dengan versi terbaru atau gunakan CDN ( http://www.bootstrapcdn.com/ )

  2. Migrasikan html Anda, ya memang baca http://bootply.com/bootstrap-3-migration-guide . Anda dapat mencoba http://twitterbootstrapmigrator.w3masters.nl/ atau http://code.divshot.com/bootstrap3_upgrader/ (juga menyediakan daftar periksa)

  3. hapus html5shiv karena TB menghentikan dukungan untuk IE7 dan Firefox 3.x tambahkan html5shiv.js untuk menambahkan dukungan elemen HTML5 ke IE8

  4. tambahkan respond.js ( https://github.com/scottjehl/Respond ) untuk dukungan kueri media di IE. CATATAN ini tidak akan berfungsi dengan CDN, lihat: Masalah IE8 dengan Twitter Bootstrap 3

  5. Jika Anda menggunakan Glyphicons, Anda harus menambahkannya dari http://glyphicons.getbootstrap.com/ (ikon telah dipindahkan ke repositori terpisah.) Glyphicons sudah kembali sejak RC2 (180 glyphs dalam format font dari set Glyphicon Halflings)

  6. Jika Anda menggunakan komponen Javascript Typeahead, Anda harus mengintegrasikan https://github.com/twitter/typeahead.js/ (menyebabkan javascript typeahead terputus) Lihat juga: Masalah typeahead dengan Bootstrap 3.0 RC1 Atau gunakan plugin "lama" : https://github.com/bassjobsen/Bootstrap-3-Typeahead , lihat juga: /programming/18615964/ajax-call-in-bootstrap-3-0-typeahead/18620473

  7. Beralih ke versi terbaru jQuery 1.x (jangan gunakan versi 2.x karena jQuery 2.x tidak mendukung IE8)

  8. Jika Anda menggunakan widget pihak ketiga yang menambahkan atau menyisipkan html ke kode Anda (seperti addthis.com, sharethis.com, dan peta Google), buat pembungkus untuk ukuran kotak, lihat: kanan penghitung AddThis hilang dengan Twitter's Bootstrap 3

Lain:

Bootstrap 3 beralih ke ukuran kotak: perbatasan-kotak mengapa ?: https://stackoverflow.com/a/18858771/1596547

Catatan dukungan untuk IE7 telah dihentikan. https://github.com/coliff/bootstrap-ie7 coba tambahkan kembali bagian css dengan menggunakan beberapa CSS bersyarat.

Bass Jobsen
sumber
Kedengarannya seperti usaha yang besar. Berapa lama waktu yang dibutuhkan? 1 minggu kerja? 1 bulan? 6 bulan?
Curt
masalahnya adalah bahwa BS2 tidak kompatibel dengan BS3, lihat juga bassjobsen.weblogs.fm/…
Bass Jobsen
1
Jika saya harus menebak, menurut saya perlu beberapa bulan untuk meningkatkan. Brutal.
Curt
@Curt mengirimi saya email. Mungkin saya bisa membantu Anda?
Bass Jobsen
Bagaimana cara mengirimi Anda email? Melalui akun Twitter Anda? Saya membaca lebih banyak tentang v3 dan tampaknya ini terutama untuk menambahkan dukungan untuk ponsel lama. Jika demikian, saya rasa saya tidak perlu v3.
Curt
22

Diperbarui 2018

Bootstrap 3 hingga 4

Alat pemutakhiran Bootstrap 4 (ini akan membantu untuk bermigrasi dari Bootstrap 3 ke 4)

Bootstrap 2 hingga 3

Kandidat rilis (bukan rilis final 3) untuk Bootstap 3 RC 1 diumumkan Jumat (26 Juli 2013), jadi belum ada panduan migrasi resmi.

Ada perubahan besar untuk Bootstrap 3. Tidak ada kompatibilitas mundur dengan 2.x, jadi Anda tidak bisa begitu saja mengganti file. Namun Anda dapat menemukan beberapa panduan berguna di sini di Bootply:

http://bootply.com/bootstrap-3-migration-guide

Ada juga alat migrasi Bootstrap yang sedang dikerjakan: https://github.com/iatek/bootstrap-migrate

Alat peningkatan Bootstrap 2.x ke 3: http://upgrade-bootstrap.bootply.com/v3

Zim
sumber
1
Salam dari masa depan! Berikut adalah alat Bootstrap 4: upgrade-bootstrap.bootply.com
Zim
14

hampir tidak mungkin untuk bermigrasi dari bootstrap 2.3 ke 3.0. perubahan versinya sangat drastis. Saya mencoba mengupdate proyek zend framework 2 saya dengan bootstrap 3.0 dan hasilnya berantakan (seperti mencoba membuka dengan IE 5).

Saran saya: proyek lama menggunakan bootstrap 2.X biarkan dengan bootstrap 2.x. Proyek awal baru, mulai dengan 3.0.

Menurut saya perubahan versi tersebut merupakan kesalahan yang sangat besar dari tim bootstrap. Mereka seharusnya melakukan pembaruan bertahap 2.4, 2.5, 2.6 ....

albanx.dll
sumber
8
Saya tidak setuju dengan yang hampir mustahil. Sangat mungkin untuk bermigrasi, Anda hanya perlu mengikuti panduan yang diberikan. Lihat postingan wiki komunitas untuk link. Juga mengikuti nomor versi semantik, upgrade besar diperbolehkan untuk memutuskan kontrak antarmuka. Jadi nomor versi utama dengan tepat mewakili kemungkinan jeda ini.
Jafin
1
Sangat sulit untuk bermigrasi. Saya pikir ini adalah nasihat yang bagus. Ini bukan tidak mungkin, tetapi sulit - tidak seperti meningkatkan dari versi sebelumnya 2. * ke 2. * lainnya.
d -_- b
Bukan tidak mungkin dan menjadi jauh lebih mudah jika Anda dapat mencari / mengganti pola seperti span12.
tadman
3
Saya dapat memastikan Anda bahwa saya membuat semua kemungkinan penggantian, bahkan pada css terpisah di mana saya mengganti tema default boostrap, dan dalam kode, tetapi saya tidak mendapat hasil yang baik. Jangan berpikir tentang span12 saja, pikirkan tentang semua span *, semua nav, tabel, dan lainnya, pikirkan tentang penggunaan bootstrap yang berat
albanx
Bootstrap (seperti banyak kerangka web) mengikuti Versi Semantik , oleh karena itu perubahan dari 2. * ke 3 memperkenalkan perubahan API yang tidak kompatibel.
Jake Berger
0

Tidak yakin tapi gunakan ekstensi joomla rereplacer ini

lihat tautan ini,

http://www.nonumber.nl/extensions/rereplacer

jika tidak, penggantian template adalah satu-satunya cara untuk melakukannya.

Kumar Ramalingam
sumber
0

Jika Anda memiliki aplikasi besar dengan banyak file dengan banyak penyesuaian, setiap alat kemungkinan besar tidak dapat menjawab sebagian besar kasus yang Anda hadapi.

Pertama, tentu saja, saya sarankan untuk mencoba: https://pypi.python.org/pypi/b2tob3/0.4 tetapi ini tidak akan menjawab kebutuhan saya, saya bercabang versi ini dan menyesuaikan versi saya sendiri untuk dapat bermigrasi bersama Bootstrap 2 hingga 3 dan Font Awesome 3 hingga 4 bersama-sama, beberapa kasus yang tidak ditangani di b23tob3-v0.4 (yang asli) mencoba untuk menangani di versi saya.

Baca posting saya di sini: http://ask.osify.com/qa/589 Temukan pembaruan saya di github: https://github.com/metrey/b2tob3 Anda juga dapat menemukan aplikasi Windows yang dikompilasi di sana juga untuk digunakan segera .

SELALU buat cadangan file Anda dan lakukan semuanya ke kontrol sumber sebelum menggunakan alat ini.

Semoga beruntung dan bagikan pemikiran Anda.

Osify
sumber