Хорошо. Я знаю, что это действительно элементарная проблема, но я не могу понять. Это вопрос о Ларавеле.
В принципе, у меня есть таблицы стилей, встроенные в мой макет по умолчанию. В настоящее время я использую обычный css для их ссылки, например:
<link rel="stylesheet" href="css/app.css" />
Он отлично работает, когда я на одном уровне, например /о, но перестает работать, когда я иду глубже, например /about/me.
Если я посмотрю на консоль разработчика Chrome, я вижу некоторые из следующих ошибок (только для более глубоких маршрутов):
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://example.dev/about/css/app.css".
Итак, теперь он ищет css внутри папки "about", что, конечно, не является папкой вообще.
Я просто хочу, чтобы он смотрел то же место для активов, независимо от маршрута.
Для Laravel 4 и 5:
<link rel="stylesheet" href="{{ URL::asset('assets/css/bootstrap.min.css') }}">
URL::asset
будет ссылаться на ваш project/public/
folder, так что добавьте свои скрипты туда.
.blade.php
.Laravel 4
Лучший и правильный способ сделать это
Добавление CSS
HTML:: style будет ссылаться на ваш проект/публикацию/папку
{{ HTML::style('css/bootstrap.css') }}
Добавление JS
HTML:: script будет ссылаться на ваш проект/публикацию/папку
{{ HTML::script('js/script.js') }}
Вы используете относительные пути для своих активов, переходите к абсолютному пути и все будет работать (добавьте косую черту перед "css".
<link rel="stylesheet" href="/css/app.css" />
в Laravel 5,
есть два способа загрузить файл js в вашем представлении
сначала используется html-помощник, второй - с помощью помощников активов.
для использования html-помощника вы должны сначала установить этот пакет через командную строку:
composer require illuminate/html
тогда вам нужно его перезаписать, поэтому перейдите в config/app.php и добавьте эту строку в массив поставщиков
'Illuminate\Html\HtmlServiceProvider'
тогда вам нужно определить псевдонимы для вашего html-пакета, поэтому перейдите в aliases array в config/app.php и добавьте это
'Html' => 'Illuminate\Html\HtmlFacade'
теперь ваш html-помощник установлен так, что в файлах просмотра вашего лезвия вы можете написать это:
{!! Html::script('js/test.js') !!}
это будет искать ваш файл test.js в файле project_root/public/js/test.js.
//////////////////////////////////////////////////////////////
для использования помощников ресурсов вместо html-помощника, вы должны написать sth, как это, в ваших файлах просмотра:
<script src="{{ URL::asset('test.js') }}"></script>
это будет искать файл test.js в project_root/resources/assets/test.js
<script src="{{ url(asset('test.js')) }}"></script>
(или <script src="{{ url(mix('test.js')) }}"></script>
если вы используете Laravel Mix).
Я предполагаю, что вы используете Laravel 3, если да, разместите ваши файлы CSS/JS в общей папке, например
public/css
public/js
и назовите его с помощью шаблонов Blade
{{ HTML::style('css/style.css'); }}
{{ HTML::script('js/jquery-1.8.2.min.js'); }}
Я предлагаю вам поместить его в фильтр маршрута до {project}/application/routes.php
Route::filter('before', function()
{
// Do stuff before every request to your application...
Asset::add('jquery', 'js/jquery-2.0.0.min.js');
Asset::add('style', 'template/style.css');
Asset::add('style2', 'css/style.css');
});
и используя механизм шаблонов лезвий
{{ Asset::styles() }}
{{ Asset::scripts(); }}
или более на laravel управлять документами по активам
Laravel 5.4 с помощником смешивания:
<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
<script src="{{ mix('/js/app.js') }}"> </script>
У Винса почти все было правильно вы должны добавить
<base href="{{URL::asset('/')}}" target="_top">
и скрипты должны идти в своем обычном пути
<script src="js/jquery/jquery-1.11.1.min.js"></script>
причина этого в том, что изображения и другие вещи с относительным путем, например, с источником изображения или ajax-запросами, будут работать некорректно без привязки базового пути.
Лучший способ, по-моему, добавить тег BASE в ваш HTML
<base href="/" target="_top">
Так что не нужно использовать такие вещи, как
{{ HTML::script('js/jquery/jquery-1.11.1.min.js'); }}
просто введите
<script src="js/jquery/jquery-1.11.1.min.js"></script>
в вашем представлении, и он будет работать.
Этот mehod будет обрабатывать URL-адреса RESTful и статические ресурсы как изображения, css, скрипты.
в laravel 4
вам просто нужно вставить {{ URL::asset('/') }}
следующим образом:
<link rel="stylesheet" href="{{ URL::asset('/') }}css/app.css" />.
То же самое для:
<script language="JavaScript" src="{{ URL::asset('/') }}js/jquery.js"></script>
<img src="{{ URL::asset('/') }}img/image.gif">
Просто добавьте еще один вопрос:
Если вы хотите удалить /public
из своего проекта, используя .htaccess
,
то вы можете использовать это, [Добавить public
до /css
внутри asset()
]
<link href="{{ asset('public/css/app.css') }}" rel="stylesheet">
[Иногда это полезно.]
Предположим, вы не переименовали свою общую папку. Файлы css и js находятся в подкаталогах css и js в общей папке. Теперь ваш заголовок будет:
<link rel="stylesheet" type="text/css" href="/public/css/icon.css"/>
<script type="text/javascript" src="/public/js/jquery.easyui.min.js"></script>
Лучший способ использовать, например,
<link rel="stylesheet" href="{{asset('assets/libraries/css/app.css')}}">
Если вы делаете жесткий код, вам, вероятно, следует использовать полный путь (href="http://example.com/public/css/app.css"
). Однако это означает, что вам придется вручную настроить URL-адреса для разработки и производства.
Альтернативой вышеупомянутым решениям было бы использовать <link rel="stylesheet" href="URL::to_asset('css/app.css')" />
в Laravel 3 или <link rel="stylesheet" href="URL::asset('css/app.css')" />
в Laravel 4. Это позволит вам написать свой HTML так, как вы этого хотите, но также позволить Laravel создать правильный путь для вы в любой среде.
В Laravel 5.7 поместите ваш файл CSS или JS в публичный каталог.
Для CSS:
<link rel="stylesheet" href="{{ asset('bootstrap.min.css') }}">
Для JS:
<script type="text/javascript" src="{{ asset('bootstrap.js') }}"></script>
Для Laravel 4: {!! для двойной фигурной скобки {{
и для версии Laravel 5 и выше: вы можете заменить {!! {{и !!} by}} в старшей версии
Если вы поместили JavaScript в пользовательский каталог.
Например, если ваш jQuery-2.2.0.min.js
находится в каталоге resources/views/admin/plugins/js/
то из *.blade.php
вы сможете добавить в конце раздела как
<script src="{!! asset('resources/views/admin/plugins/js/jQuery-2.2.0.min.js') !!}"></script>
Так как версия Higher-End также поддерживает версию Low-End, но не наоборот