Laravel8开荒~正确安装前端Bootstrap CSS库

Laravel8抛弃了Bootstrap,使用Laravel Jetstream,对于习惯了Bootstrap的老用户来说着实不是一件好事。因为其使用的ui库为livewire。无形中提高了学习成本。

1.安装最新的Bootstrap

$ composer require laravel/ui:^3.0 --dev

2.引入Bootstrap

$ php artisan ui bootstrap

3.执行npm命令

$ npm install

该命令会下载node_modules文件夹,里面就包括了bootstrap,当然这一切的前提是,你的npm已经换为aliyun的源了!

4.然后安装两个所需模块

$ npm install --no-bin-link
$ npm add cross-env

5.删除不需要的目录

$ sudo rm -rf resources/css

因为Laravel8安装后resources目录会有一个css目录,估计这个是为Tailwind CSS所准备的吧!

6.最后优化,解决浏览器缓存问题

打开webpack.min.js文件,在.sass()方法后添加.version()方法

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css').version();//here

7.生成编译文件

$ npm run dev

执行以上命令后,会自动生成编译好的jscss文件到public目录
如果你想实时监听scss文件和js源文件的修改,使用以下命令:

$ npm run watch-poll

愉快的使用bootstrap吧。

本作品采用《CC 协议》,转载必须注明作者和本文链接
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 3

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!