Как включить внешний CSS и JS файл в Laravel 5

Ответ 1

Я думаю, что правильный путь:

<script type="text/javascript" src="{{ URL::asset('js/jquery.js') }}"></script>

Здесь у меня есть каталог js в папке laravel app/public. Там у меня есть файл jquery.js. Функция URL:: asset() создает необходимый URL-адрес для вас. То же самое для css:

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

Надеюсь, что это поможет.

Имейте в виду, что старые mehods:

{{ Form::script() }}

и

{{ Form::style() }}

устарели и не будут работать в Laravel 5!

Ответ 2

Попытайся.

Вы можете просто пройти путь к таблице стилей.

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

Вы можете просто пройти путь к javascript.

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

Добавьте следующие строки в раздел require файла composer.json и запустите обновление композитора "illuminate/html": "5. *".

Зарегистрируйте поставщика услуг в config/app.php, добавив следующее значение в массив поставщиков:

'Illuminate\Html\HtmlServiceProvider'

Зарегистрируйте фасады, добавив эти две строки в массив псевдонимов:

'Form'=> 'Illuminate\Html\FormFacade', 'HTML'=> 'Illuminate\Html\HtmlFacade'

Ответ 3

В laravel 5.1,

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

Если местоположение папки с ресурсами находится в общей папке

Ответ 4

Я использую этот способ, не забудьте поместить ваш файл css в общую папку.

например, я ставлю свой bootstrap css на

"root/public/bootstrap/css/bootstrap.min.css"

для доступа к заголовку:

<link href="{{ asset('bootstrap/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css" >

надеюсь, что эта помощь

Ответ 5

Поместите свои ресурсы в общедоступный каталог и используйте следующие

URL::to()

Пример

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

Ответ 6

{{ HTML::style('yourcss.css') }}
{{ HTML::script('yourjs.js') }}

Ответ 7

Хорошо, поэтому я смог найти версию 5.2. Сначала вам нужно создать папку с ресурсами в своей общей папке, затем поместить в нее папку css и все файлы css, а затем связать ее следующим образом:

<link href="assets/css/bootstrap.min.css" rel="stylesheet">

Надеюсь, что это поможет!

Ответ 8

Laravel 5.5 поставляется с mix, заменой для Elixir, внешний css (sass) можно извлечь из ресурсов/активов/css (sass) и импортировать в app.css(scss) или указать правильный путь к папке node_module который содержит библиотеку и может использоваться как

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

То же самое можно сделать и для Javascript.

Ответ 9

Во - первых, вы должны поставить .css или .js файлы в public папке вашего проекта. Вы можете создать вложенные папки и переместить их в подпапку. Тогда вам нужно сделать следующее

<link rel="stylesheet" href="{{asset('css/your_css_file.css')}}">
<script src="{{asset('js/your_js_file.js')}}"></script>

В моем примере я создал две подпапки, называемые css и js. Я помещаю все файлы .css и .js в соответствующие папки и использую их там, где захочу. Спасибо, и надеюсь, что это поможет вам.

Ответ 10

Сначала вам нужно установить вспомогательный класс Illuminate Html:

composer require "illuminate/html":"5.0.*"

Далее вам нужно открыть /config/app.php и обновить следующим образом:

'providers' => [

...

Illuminate\Html\HtmlServiceProvider::class,
],

'aliases' => [

...

'Form' => Illuminate\Html\FormFacade::class, 
'HTML' => Illuminate\Html\HtmlFacade::class,
],

Чтобы подтвердить свое использование, выполните следующую команду:

php artisan tinker
> Form::text('foo')
"<input name=\"foo\" type=\"text\">"

Чтобы включить внешние css в ваши файлы, используйте следующий синтаксис:

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

Ответ 11

Я могу опаздывать на вечеринку, но легко включить JS и CSS в Laravel Way, просто используя функцию asset()

например. <link rel="stylesheet" href="{{ asset('css/app.css') }}" />

Надеюсь, что поможет

Ответ 12

ПРАВИЛЬНЫЙ И БЕЗОПАСНЫЙ ПУТЬ

Если у вас есть внешний .css или .js для добавления на вашу страницу!

Моя версия: Laravel Framework 5.7

Если вы хотите добавить внешний файл .js..

1. Скопируйте ваши Внешние коды.
2. Запустите команду npm install в вашем терминале.
3. После выполнения вышеуказанной команды вы можете увидеть папку с именем node_modules.
4. Затем перейдите к ресурсам /JS.
5. Откройте файл app.js
6. Прокрутите вниз и вставьте свой Внешний JS.
7. Наконец, выполните команду npm run dev в вашем терминале.

Ваши скрипты будут обновлены, скомпилированы и перемещены в public/js/app.js добавление файла .js в .js папку не повлияет на вашу страницу.

Если вы хотите добавить внешний .css файл..

1. Скопируйте ваши Внешние стили.
2. Запустите команду npm install в вашем терминале.
3. После выполнения вышеуказанной команды вы можете увидеть папку с именем node_modules.
4. Затем перейдите на ресурсы/sass.
5. Откройте файл app.scss.
6. Прокрутите вниз и вставьте ваши внешние стили.
7. Наконец, выполните команду npm run dev в вашем терминале.

Ваши скрипты будут обновлены, скомпилированы и перемещены в public/css/app.css. добавление файла .css в .css папку не повлияет на вашу страницу.

• Самый простой и безопасный способ добавить ваши внешние .css и .js.

Laravel JavaScript & CSS Scaffolding

Компиляция YouTube

Ответ 13

Правильный метод в Laravel 5 это как