如何在 Laravel 5.1 项目中链接外部 CSS 和脚本（资产）

Question

大家好，我是 Laravel 的新手，这是我在 laravel 中做的第一个项目，我无法在我的视图上链接我的资产（CSS 和 Js）文件。我做了一项研究，发现我是否会使用 {{URL::asset('assets/plugins/bootstrap/css/bootstrap.min.css')}}在 Laravel 5.1 中它会起作用。当它只是一个链接时我确实成功了，但是当我添加其他链接时..

<link rel="stylesheet" href="{{URL::asset('assets/plugins/animate.css')}}">
<link rel="stylesheet" href="{{URL::asset('assets/plugins/line-icons/line-icons.css')}}">
<link rel="stylesheet" href="{{URL::asset('assets/plugins/parallax-slider/css/parallax-slider.css')}}">
<link rel="stylesheet" href="{{URL::asset('assets/css/custom.css')}}">

服务器拒绝访问资产文件夹Access forbidden! 中的所有文件。 我的 .htaccess 文件代码是..

<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
    Options -MultiViews
</IfModule>
RewriteEngine On

# Redirect Trailing Slashes If Not A Folder...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/$ /$1 [L,R=301]

# Handle Front Controller...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.php [L]
</IfModule>

问题是如果 .htaccess 文件有问题，为什么当我放置一个资产链接时它接受？ 或者链接文件的正确方法是什么？ 我使用 XAMPP 作为我的本地服务器。 *伙计，我昨天刚学 Laravel，所以请放轻松...提前谢谢

Answer 1

在我的情况下，我看起来在这个地方的上方丢弃了错误。 我发现我在外观相同的声明中漏掉了一个“'”字符：

<script src="{{asset('js/bootstrap.min.js)}}"></script>

那里的某个地方。 如您所见，“.js”之后缺少字符“'” 所以在这个错误位置之前，所有下面的声明都没有“'”对

Answer 2

感谢大家帮助我解决了我的问题。

1. 我又去了http://laravel.com/docs/5.1/helpers#method-asset
   • 我发现他们说$url = asset('img/photo.jpg'); 会给我资产文件的网址。

2. 所以我选择了路线……

   Route::get('check', function () {
   
   $url = asset('assets/css/headers/header-default.css');
   
   return $url;
   }); 
   

   我得到了链接http://localhost/Dentist/public/assets/css/headers/header-default.css

3. 所以我只是违反了规则，如果有的话，我在我的样式表中这样做了。

<link rel="stylesheet" href="<?php echo $url = asset('assets/css/style.css'); ?>">

--> ** 除此之外，您还可以这样做 **

{!!asset('assets/plugins/jquery/jquery.min.js')!!}

因为如果你使用刀片，那么就不需要使用<?php echo ; ?> 命令...所以我将<?php echo $url = ; ?> 替换为{!! asset('assets/css/...') !!} 确保您的文件在public/assets/ 目录中

谢谢大家

Answer 3

可以使用 laravel 刀片模板方法

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

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

注意：您应该将 css 文件添加到公用文件夹中，这意味着在我的示例中它将类似于 public/css 文件夹。 同样也将应用于 jquery 文件。

如果您使用在线链接，也可以添加以下方式

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

否则

<link rel="stylesheet" href="{{ URL::asset('css/style.css') }}" />
<script type="text/javascript" src="{{ URL::asset('js/jquery.js') }}"></script>

Answer 4

使用Laravel Collective HTML Package

安装完这个包就可以这样使用了

{!! Html::style('your/css/file.css') !!}
{!! Html::script('your/js/file.js') !!}
{!! Html::image('your/image/file.jpg') !!}

Answer 5

添加资产时最好使用资产助手http://laravel.com/docs/5.1/helpers#urls

外用

<link rel="stylesheet" href="{{asset('//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css')}}">

laravel 还附带了一个 htaccess 文件，尝试将其替换为你的 https://github.com/laravel/laravel/blob/master/public/.htaccess

同时为您的目录提供正确的权限

Folders 755

Files 644

Apart from;

app/storage 777 (or 755 with owner as webserver user)

Answer 6

试试这个并将 css 替换为您的文件夹名称。

<link rel="stylesheet" href="{{asset('css/home.css')}}">