Что Laravel таблицы стилей и JavaScript не загружаются для не основной стороны



хорошо--я знаю, что это действительно элементарная проблема, но я не могу понять это. Это вопрос относительно Laravel.



в основном, у меня есть мои таблицы стилей, встроенные в мой вид макета по умолчанию. В настоящее время я просто использую обычный 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", которая, конечно же, не является папкой вообще.



Я просто хочу, чтобы он смотрел в одном и том же месте для активов независимо от маршрута.

670   15  

15 ответов:

Для Laravel 4 & 5:

<link rel="stylesheet" href="{{ URL::asset('assets/css/bootstrap.min.css') }}">

URL:: asset будет ссылка на ваш project / public/ папка, так что бросьте свои скрипты туда.

Примечание: вам нужно будет использовать шаблоны лезвий, чтобы использовать это. Все шаблоны лезвий должны использовать .лезвие.расширение PHP.

Laravel 4

лучший и правильный способ сделать это

добавление CSS

HTML:: style будет ссылаться на ваш проект / public / folder

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

добавление JS

HTML:: скрипт будет ссылаться на ваш проект / public / folder

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

Я предполагаю, что вы используете Laravel 3, если да, поместите ваши файлы CSS / JS в общую папку, например

public/css
public/js

и назовите его с помощью шаблонов Blade

{{ HTML::style('css/style.css'); }}
{{ HTML::script('js/jquery-1.8.2.min.js'); }}

вы используете относительные пути для своих активов, переходите на абсолютный путь, и все будет работать (добавьте косую черту перед "css".

<link rel="stylesheet" href="/css/app.css" />

в Laravel 5,
есть 2 способа загрузить файл js в вашем представлении
первый-это с помощью HTML-помощников, второй-через помощников активов.
чтобы использовать HTML-Helper вы должны сначала установить этот пакет через командную строку:

composer require illuminate/html

затем вам нужно повторно зарегистрировать его, поэтому перейдите в config/app.php, и добавьте эту строку в массив провайдеров

'Illuminate\Html\HtmlServiceProvider'

затем вам нужно определить псевдонимы для вашего пакета html, поэтому перейдите в массив псевдонимов config / app.php и добавить это

'Html'     => 'Illuminate\Html\HtmlFacade'

теперь ваш HTML-помощник установлен, поэтому в ваших файлах просмотра Блейда вы можете написать следующее:

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

это будет искать ваш тест.js-файл в вашем project_root/public/js / test.js.
//////////////////////////////////////////////////////////////
чтобы использовать Asset helpers вместо HTML helper, вы должны написать sth следующим образом в своих файлах просмотра:

<script src="{{ URL::asset('test.js') }}"></script>

это будет искать тест.js файл в project_root / resources/assets / test.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');

});

и с помощью blade template engine

{{ Asset::styles() }}
{{ Asset::scripts(); }}

на laravel Управление Активами docs

на 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">

лучший способ на мой взгляд добавить базовый тег в 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 будет иметь дело с RESTful URL и статическими ресурсами в виде изображений, css, скриптов.

Винса почти все сделал правильно вы должны добавить

<base href="{{URL::asset('/')}}" target="_top">

и скрипты должны идти по своему обычному пути

<script src="js/jquery/jquery-1.11.1.min.js"></script>

причина этого заключается в том, что изображения и другие вещи с относительным путем, такие как источник изображения или запросы ajax, не будут работать правильно без прикрепленного базового пути.

Laravel 5.4 с помощником mix:

<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
<script src="{{ mix('/js/app.js') }}"> </script>

Если вы делаете жесткий код, вы, вероятно, должны использовать полный путь (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 генерировать правильный путь для вас в любой среде.

лучший способ использовать, как,

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

предположим, что вы не переименовали свою общую папку. Ваши файлы 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>

Просто Добавьте Еще Один Вопрос:

если вы хотите удалить /public из вашего проекта с помощью .htaccess,

затем вы можете использовать это, [добавить public до /css внутри asset()]

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

[иногда, это полезно.]

Для Laravel 4: {!! для двойной фигурной скобки { {
и для Laravel 5 & выше версии: вы можете заменить {!! на {{ и !!} к }} в версии

если вы разместили 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>

С Более Высокого Уровня версия поддерживает нижнюю версию также и, но не наоборот

Comments

    Ничего не найдено.