Actualización de Bootstrap a la versión 3: ¿qué tengo que hacer?

102

Soy nuevo en Bootstrap y tengo la versión anterior 2.3.2.

Se ha lanzado la versión 3. ¿Debo simplemente reemplazar los archivos CSS y Javascript si quiero usar la última versión?

twitter-bootstrap  twitter-bootstrap-3 
— Enrique
fuente
Es posible que desee leer sobre los cambios y asegurarse de que no rompan nada que ya tiene en su lugar, pero sí, simplemente reemplace los archivos
— Patsy Issa
Sí, solo quiero asegurarme de que estoy haciendo esto correctamente. Creo que Bootstrap ha sido lo mejor de la historia, es increíble. Estoy ansioso por usar la próxima versión. Estoy seguro de que estaba leyendo en algún lugar que use .less para administrar actualizaciones, pero probablemente me equivoque con eso.
— Henry
1
posible duplicado de Bootstrap
— Bass Jobsen
Tenga en cuenta que a pesar de que los documentos dicen que todo es "fluido" en 3.0, todavía usa anchos de píxeles fijos para los contenedores ... lo cual es un poco tonto, ya que es exactamente lo opuesto al diseño fluido.
— Cerin

Respuestas:

134

  1. Descargue la última versión de http://getbootstrap.com/ O Reemplace los archivos css y js con las versiones más recientes o use CDN ( http://www.bootstrapcdn.com/ )

  2. Migre su html, sí, lea http://bootply.com/bootstrap-3-migration-guide . Puede probar http://twitterbootstrapmigrator.w3masters.nl/ o http://code.divshot.com/bootstrap3_upgrader/ (proporcione una lista de verificación también)

  3. eliminar html5shiv porque TB cae compatibilidad con IE7 y Firefox 3.x agregue html5shiv.js para agregar soporte de elementos HTML5 a IE8

  4. agregue respond.js ( https://github.com/scottjehl/Respond ) para soporte de consulta de medios en IE. NOTA: esto no funcionará con CDN, consulte: Problema de IE8 con Twitter Bootstrap 3

  5. Si usa Glyphicons, tendrá que agregarlos desde http://glyphicons.getbootstrap.com/ (los íconos se han movido a un repositorio separado). Los glifos están de vuelta desde RC2 (180 glifos en formato de fuente del conjunto Glyphicon Halflings)

  6. Si usa el componente Javascript Typeahead, tendrá que integrar https://github.com/twitter/typeahead.js/ (porque se descarta el javascript typeahead) Vea también: Problemas de Typeahead con Bootstrap 3.0 RC1 O use el complemento "antiguo" : https://github.com/bassjobsen/Bootstrap-3-Typeahead , consulte también: /programming/18615964/ajax-call-in-bootstrap-3-0-typeahead/18620473

  7. Cambie a la última versión de jQuery 1.x (no use la versión 2.x porque jQuery 2.x no es compatible con IE8)

  8. Si utiliza widgets de terceros que agregan o insertan html en su código (como addthis.com, sharethis.com y mapas de Google), cree un contenedor para el tamaño de la caja, consulte: Falta el borde derecho del contador AddThis con Bootstrap 3 de Twitter

Otro:

Bootstrap 3 cambia a tamaño de caja: border-box ¿por qué ?: https://stackoverflow.com/a/18858771/1596547

Tenga en cuenta que se ha eliminado la compatibilidad con IE7. https://github.com/coliff/bootstrap-ie7 intente agregar la parte css nuevamente con el uso de CSS condicional.

— Bass Jobsen
fuente
Suena como una gran empresa. ¿Cuánto tiempo debería tomar esto? 1 semana de trabajo? ¿1 mes? ¿6 meses?
— Curt
el problema es que BS2 no es compatible con versiones anteriores de BS3, consulte también bassjobsen.weblogs.fm/…
— Bass Jobsen
1
Si tuviera que adivinar, diría que la actualización puede llevar algunos meses. Brutal.
— Curt
@Curt envíame un correo electrónico. ¿Quizás pueda ayudarte?
— Bass Jobsen
¿Cómo les envío un correo electrónico? ¿A través de tu cuenta de Twitter? Leí un poco más de v3 y parece que es principalmente para agregar soporte para teléfonos más antiguos. Si es así, no creo que necesite v3.
— Curt
22

Actualizado 2018

Bootstrap 3 a 4

Herramienta de actualización Bootstrap 4 (esto ayudará a migrar de Bootstrap 3 a 4)

Bootstrap 2 a 3

El viernes (26 de julio de 2013) se anunció una versión candidata (no la versión final 3) para Bootstap 3 RC 1, por lo que aún no hay una guía oficial de migración.

Hay cambios importantes para Bootstrap 3. No hay compatibilidad hacia atrás con 2.x, por lo que no puede simplemente reemplazar los archivos. Sin embargo, puede encontrar una guía útil aquí en Bootply:

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

También hay una herramienta de migración Bootstrap en proceso: https://github.com/iatek/bootstrap-migrate

Herramienta de actualización Bootstrap 2.xa 3: http://upgrade-bootstrap.bootply.com/v3

— Zim
fuente
1
¡Saludos desde el futuro! Aquí está la herramienta Bootstrap 4: upgrade-bootstrap.bootply.com
— Zim
14

es casi imposible migrar de bootstrap 2.3 a 3.0. el cambio de versión es muy drástico. Intenté actualizar mi proyecto zend framework 2 con bootstrap 3.0 y los resultados fueron un desastre (como intentar abrir con IE 5).

Mi consejo: un proyecto antiguo que usa bootstrap 2.X se deja con bootstrap 2.x. Nuevo proyecto inicial, comience con 3.0.

En mi opinión, este cambio de versión fue un gran error del equipo de arranque. Deberían haber hecho una actualización gradual 2.4, 2.5, 2.6 ....

— Albanx
fuente
8
No estoy de acuerdo con lo casi imposible. Es completamente posible migrar, solo necesita seguir las instrucciones proporcionadas. Consulte la publicación de la wiki de la comunidad para obtener enlaces. También siguiendo los números de versión semántica, se permite una actualización importante para romper los contratos de interfaz. Entonces, el número de versión principal representa correctamente esta posible ruptura.
— Jafin
1
Es muy difícil migrar. Creo que este consejo es genial. No es imposible, pero es difícil, nada como actualizar desde versiones anteriores de 2. * a otra 2. *.
— d -_- b
No es imposible y se hace mucho más fácil si puede buscar / reemplazar patrones como span12.
— tadman
3
Puedo asegurarles que hice todos los reemplazos posibles, incluso en CSS separado donde anulo el tema predeterminado de boostrap, y en el código, pero no obtuve un buen resultado. No piense solo en span12, piense en todos los span *, todos los navegadores, tablas y más, piense en un uso intensivo y profundo de bootstrap
— albanx
Bootstrap (como muchos frameworks web) sigue el control de versiones semántico , de ahí el cambio de 2. * a 3 que introduce cambios de API incompatibles.
— Jake Berger
0

Si tiene una aplicación grande con muchos archivos con mucha personalización, es probable que cada herramienta no pueda responder a la mayoría de los casos que enfrenta.

Primero, por supuesto, recomiendo probar: https://pypi.python.org/pypi/b2tob3/0.4 pero esto no responde a mi necesidad, bifurqué esta versión y adapté la mía propia para poder migrar juntos Bootstrap 2 a 3 y Font Awesome 3 a 4 juntos, algunos casos que no se tratan en b23tob3-v0.4 (el original) están tratando de tratar en mi versión.

Lea mi publicación aquí: http://ask.osify.com/qa/589 Encuentre mi actualización en github: https://github.com/metrey/b2tob3 También puede encontrar la aplicación de Windows compilada allí para usarla de inmediato .

SIEMPRE haga una copia de seguridad de sus archivos y confíe todo en el control de código fuente antes de usar la herramienta.

Buena suerte y comparte tu opinión.

— Osify
fuente
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.