Laravel 5에 외부 CSS 및 JS 파일을 포함하는 방법

Laravel 5에 외부 CSS 및 JS 파일을 포함하는 방법

---

나는 Laravel 5.0을 사용하고 있으며 Form 및 Html Helper 가이 버전에서 제거되었습니다. 내 헤더 파일에 외부 CSS 및 JS 파일을 포함하는 방법을 모르겠습니다. 현재이 코드를 사용하고 있습니다.

<link rel="stylesheet" href="/css/bootstrap.min.css"> <!---  css file  --->
<script type="text/javascript" src="/js/jquery.min.js"></script>

---

나는 이것이 올바른 방법이라고 생각합니다.

<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') }}" />

도움이 되었기를 바랍니다.

오래된 방법은 다음과 같습니다.

{{ Form::script() }}

과

{{ Form::style() }}

더 이상 사용되지 않으며 Laravel 5에서 작동하지 않습니다!

---

시도 해봐.

스타일 시트에 경로를 전달할 수 있습니다.

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

javascript 경로를 전달할 수 있습니다.

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

composer.json 파일 의 require 섹션에 다음 행을 추가하고 composer update "illuminate / html": "5. *"를 실행하십시오 .

제공자 배열에 다음 값을 추가하여 config / app.php 에 서비스 제공자를 등록하십시오 .

'Illuminate\Html\HtmlServiceProvider'

aliases 배열에 다음 두 줄을 추가하여 파사드를 등록합니다.

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

---

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>

자산 폴더 위치가 공용 폴더 내에있는 경우

---

나는 이런 식으로 사용하므로 CSS 파일을 공용 폴더에 넣는 것을 잊지 마십시오.

예를 들어 부트 스트랩 CSS를

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

헤더에서 액세스하려면 :

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

이 도움을 바랍니다

---

자산을 공용 디렉토리에 배치하고 다음을 사용하십시오.

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>

---

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

---

처음에는 .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파일을 해당 폴더에 넣고 원하는 곳에서 사용합니다. 감사합니다. 도움이 되었기를 바랍니다.

---

좋아, 나는 버전 5.2를 알아낼 수 있었다. 먼저 공용 폴더에 자산 폴더를 만든 다음 css 폴더와 모든 css 파일을 여기에 넣은 다음 다음과 같이 연결해야합니다.

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

도움이 되었기를 바랍니다.

---

Laravel 5.5에는 Elixir를 대체하는 mix가 포함되어 있으며, 외부 css (sass)는 resources / assets / css (sass)로 추출하고 app.css (scss)로 가져 오거나 라이브러리로 사용할 수 있습니다.

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

자바 스크립트도 마찬가지입니다.

---

먼저 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') !!}

---

파티에 늦었을 수도 있지만 간단히 asset () 함수를 사용하여 Laravel Way에 JS 및 CSS를 포함하는 것은 쉽습니다.

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

도움이되는 희망

---

정확하고 안전한 방법

---

페이지에 추가 할 외부 .css또는 .js파일 이있는 경우 !

내 버전 : Laravel Framework 5.7

If you want to add a External .js file..

1. Copy your External codes.
2. Run command npm install in your terminal.
3. When the above command is executed you can see a folder named node_modules.
4. Then go to resources/js.
5. Open file app.js.
6. Scroll down to the bottom and paste your External JS.
7. Finally run command npm run dev in your terminal.

your scripts will be updated and its compiled and moved to public/js/app.js . by adding a .js file in public folder will not effect on your page.

---

If you want to add a External .css file..

1. Copy your External styles.
2. Run command npm install in your terminal.
3. When the above command is executed you can see a folder named node_modules.
4. Then go to resources/sass.
5. Open file app.scss.
6. Scroll down to the bottom and paste your External Styles.
7. Finally run command npm run dev in your terminal.

your scripts will be updated and its compiled and moved to public/css/app.css . by adding a .css file in public folder will not effect on your page.

• Easiest and the safest way to add your external .css and .js.

Laravel JavaScript & CSS Scaffolding

YouTube Compiling Assets

참고URL : https://stackoverflow.com/questions/28104583/how-to-include-external-css-and-js-file-in-laravel-5