laravel 引入html,Laravel 5 中使用 HtmlBuilder 及 URL::asset() 引入站内或站外的 css 和 js 文件...

Laravel 5 中使用 HtmlBuilder 及 URL::asset() 引入站内或站外的 css 和 js 文件

由 学院君 创建于5年前, 最后更新于 1年前

版本号 #2

27704 views

16 likes

0 collects

在应用中引入站内或站外的css和js文件是一项基本需求，Laravel 5提供了多种方式来引入css和js，今天我们就来讨论这个问题。

1、HtmlBuilder

在Laravel 5之前我们使用内置的 HtmlBuilder 来添加样式和脚本文件，但是在 Laravel 5 将 HtmlBuilder 从核心中移除出去了，所以 HTML::style() 不再有效。如果你想要在 Laravel 5 中继续使用需要手动引入 illuminate/html 这个包。

我们还是通过Composer来安装：

composer require illuminate/html 5.*

安装完成后需要在config/app.php中注册服务提供者到providers数组：

Illuminate\Html\HtmlServiceProvider::class,

同时注册门面到aliases数组：

'Html' => Illuminate\Html\HtmlFacade::class,

'Form' => Illuminate\Html\FormFacade::class,

接下来你就可以在视图文件中使用如下方式来引入css和js文件了：

{!!Html::style('css/style.css')!!}

{!!Html::script('js/script.js')!!}

注：站内文件默认相对于web根目录，也就是public目录

如果要引入站外文件，可以这么实现：

{!!Html::style('//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css')!!}

{!!Html::script('//code.angularjs.org/1.2.13/angular.js')!!}

2、URL::asset()

此外，还可以使用内置的URL类上的asset()方法来引入css和js文件。

引入站内css和js：

注：默认相对于web根目录，也就是public目录

引入站外css和js：