Migrando de bootstrap 3 a bootstrap 5

Fecha de Actualización: 01 de Septiembre 2022

Bootstrap 5 fue lanzado oficialmente el 05 de Mayo de 2021, y fue integrado a Yii aproximadamente en Julio del mismo año.

Recomendaciones previas al migrar

Al tener una gran diferencia entre la version de bootrstrap 3 a la 5 es posible tengas que hacer una gran cantidad de cambios dentro de tu proyecto, sobre todo debes de evaluar que todos la compatibilidad de tus extensiones instaladas.

Dicho esto ya puedes continuar siguiendo los siguientes pasos. 

Proceso de instalación

Instalación de bootstrap 5

Deberas desintalar o comentar en el composer la version antigua de bootsrap. En mi caso tengo la version "~2.0.0" , podrias tener algo un poco diferente pero en todo caso debe ser eliminada del composer.

 

 "yiisoft/yii2-bootstrap": "~2.0.0",

Y debes agregar en el composer la siguiente linea:

 

"yiisoft/yii2-bootstrap5": ""

Y actualizar el composer. 

Nota importante: No pueden estar las dos versiones instaladas bootstrap 3 y 5, al menos no es lo normal que estan ambas versiones al mismo tiempo. 

Modo de instalación desde linux por comando composer. De igual manera se debe desistalar primero la version anterior de bootstrap.

 

 php composer.phar require --prefer-dist yiisoft/yii2-bootstrap5

Configuracion de Asset

En la plantilla básica ubica el archivo "assets/AppAsset.php" y se debe modificar la linea  'yii\bootstrap\BootstrapAsset' por 'yii\bootstrap5\BootstrapAsset'

Ejemplo de codigo original

 

    public $depends = [

        'yii\web\YiiAsset',

        'yii\bootstrap5\BootstrapAsset',

    ];

Codigo modificado

 

    public $depends = [

        'yii\web\YiiAsset',

        'yii\bootstrap5\BootstrapAsset',

    ];

Extensiones que podria necesitar cambiar

Estas son algunas de las extenciones que podria necesitar cambiar, dependiendo del numero de extenciones de su proyecto.

yii\bootstrap\Nav  --> yii\bootstrap5\Nav

yii\bootstrap\NavBar -->yii\bootstrap5\NavBar

app\widgets\Alert --> yii\bootstrap5\Alert

Cambio de formularios

Los formularios se deberan cambiar la referencia de la siguiente manera.

 

use yii\bootstrap\ActiveForm;

Se deben cambiar por:

 

use yii\bootstrap5\ActiveForm;

Gracias por dejar tus comentarios. Tus comentario son la motivación para continuar con éste blog.

Referencias: 

Git Bootstrap 5

https://github.com/yiisoft/yii2-bootstrap5