Laravel 스타일시트 및 javascript는 기본이 아닌 경로에서는 로드되지 않습니다.
그래, 이게 정말 기본적인 문제라는 건 알지만, 이해할 수가 없어.라라벨에 관한 질문입니다.
기본적으로 스타일시트는 기본 레이아웃 보기에 포함되어 있습니다.현재는 일반 css를 사용하여 다음과 같이 링크하고 있습니다.
<link rel="stylesheet" href="css/app.css" />
/about과 같은 단일 레벨의 루트에서는 매우 효과적이지만, /about/me와 같이 깊이 들어가면 동작을 정지합니다.
Chrome의 개발자 콘솔을 보면 다음과 같은 오류가 나타납니다(더 깊은 경로에만 해당).
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://example.dev/about/css/app.css".
따라서 "about" 폴더 내에서 css를 찾고 있습니다.물론 폴더는 전혀 아닙니다.
경로를 불문하고 같은 장소에서 자산을 찾길 바랄 뿐입니다.
Larabel 4 및 5의 경우:
<link rel="stylesheet" href="{{ URL::asset('assets/css/bootstrap.min.css') }}">
URL::asset
그러면 폴더에 링크가 되므로 스크립트를 그 폴더에 넣습니다.
주의: 이를 위해서는 "블레이드 템플릿 엔진"을 사용해야 합니다.블레이드 파일에는 확장자가 사용됩니다.
라라벨 4
이를 위한 더 나은 올바른 방법
CSS 추가
HTML:: style이 프로젝트/퍼블릭/폴더에 링크됩니다.
{{ HTML::style('css/bootstrap.css') }}
JS 추가
HTML::스크립트가 프로젝트/퍼블릭/폴더에 링크됩니다.
{{ HTML::script('js/script.js') }}
자산에 상대 경로를 사용하고 있으며 절대 경로로 변경하면 모든 것이 작동합니다("css" 앞에 슬래시 추가).
<link rel="stylesheet" href="/css/app.css" />
라라벨 5에서
에서 js 은 두 .
html html, html html html, html html html html html html html html html html html.
이 .
composer require illuminate/html
config이 행을 config/app.provider provider에 합니다.
'Illuminate\Html\HtmlServiceProvider'
다음 따라서 하여 이 html을 합니다.따라서 config/app.timeout의 에일리어스 배열로 이동하여 이 에일리어스를 추가합니다.
'Html' => 'Illuminate\Html\HtmlFacade'
이제 html 도우미가 설치되었으므로 블레이드 뷰 파일에 다음과 같이 쓸 수 있습니다.
{!! Html::script('js/test.js') !!}
'프로젝트_root/public/test.test' 테스트.filename 파 filename filename filename filename 。
도우미 .
<script src="{{ URL::asset('test.js') }}"></script>
project_root/syslog/syslog/test.syslog에서 test.syslog 파일을 검색합니다.
Larabel 3 및 CSS/JS 파일을 공용 폴더 내에서 사용하는 경우 다음과 같이 합니다.
public/css
public/js
그러면 다음과 같은 블레이드 템플릿을 사용하여 호출할 수 있습니다.
{{ HTML::style('css/style.css'); }}
{{ HTML::script('js/jquery-1.8.2.min.js'); }}
{project}/application/filters 전에 루트 필터에 넣는 것이 좋습니다.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 4
만 하면 요.{{ URL::asset('/') }}
방법 : 방방 this:
<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">
Larabel 5.4(믹스 도우미 포함):
<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
<script src="{{ mix('/js/app.js') }}"> </script>
Larabel 5.7에서 CSS 또는 JS 파일을 Public 디렉토리에 넣습니다.
CSS의 경우:
<link rel="stylesheet" href="{{ asset('bootstrap.min.css') }}">
JS의 경우:
<script type="text/javascript" src="{{ asset('bootstrap.js') }}"></script>
가장 좋은 방법은 HTML에 BASE 태그를 추가하는 것입니다.
<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>
효과가 있을 겁니다.
이 메뉴얼에서는, RESTful URL 와 정적 자원을 이미지, css, 스크립트로 취급합니다.
빈사는 거의 맞힐 뻔했다.
<base href="{{URL::asset('/')}}" target="_top">
스크립트는 통상적인 경로로 진행되어야 합니다.
<script src="js/jquery/jquery-1.11.1.min.js"></script>
그 이유는 이미지 및 이미지 소스나 Ajax 요청과 같은 상대 경로가 있는 다른 것들이 기본 경로를 연결하지 않으면 제대로 작동하지 않기 때문입니다.
풀패스, 풀패스, 풀패스)를 사용할 수 .href="http://example.com/public/css/app.css"
단, 개발 및 생산을 위해 URL을 수동으로 조정해야 합니다.
상기 솔루션의 대안은 다음과 같습니다.<link rel="stylesheet" href="URL::to_asset('css/app.css')" />
3 【3】로<link rel="stylesheet" href="URL::asset('css/app.css')" />
대로 쓸 수 만 아니라 이 어떤할 수 있습니다.이를 통해 원하는 방식으로 HTML을 작성할 수 있을 뿐만 아니라 Larabel이 어떤 환경에서든 적절한 경로를 생성할 수 있습니다.
더 좋은 방법은 다음과 같습니다.
<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
,
해서Add [어느 정도]를 .public
전에/css
에 inside inside inside asset()
<link href="{{ asset('public/css/app.css') }}" rel="stylesheet">
[때로는 편리합니다]
Larabel 4 경 { : {!}curly curly { { { { 블 brace {의 } { { { { { { { 。
Larabel 5 상!!!!!!!!!! {!!}( ( ) ) {{ !! !!}고급 버전에서는 }x }에 의해 }x } }
JavaScript 입니다.
예를 들어, 가 디렉토리 아래에 있는 경우는, 에서 섹션의 마지막에 다음과 같이 추가할 수 있습니다.
<script src="{!! asset('resources/views/admin/plugins/js/jQuery-2.2.0.min.js') !!}"></script>
High-End 버전은 Low-End 버전도 지원하지만 그 반대도 지원하지 않습니다.
이를 위한 더 나은 올바른 방법은 다음과 같습니다.
<link rel="stylesheet" href="{{ asset('assets/css/bootstrap.min.css') }}">
인 라라벨 5.8
<script src="{{asset('js/customPath1/customPath2/customjavascript.js')}}"></script>
날 위해 트릭을 만들었어
스크립트 파일을 퍼블릭디렉토리에 저장하고 (예를 들어 userFunctions.js)를 사용합니다.
<script type="text/javascript" src="{{asset('js/userFunctions.js')}}">
언급URL : https://stackoverflow.com/questions/15232600/laravel-stylesheets-and-javascript-dont-load-for-non-base-routes
'programing' 카테고리의 다른 글
MySQL 5.6에서 5.7로 이행한 이후 MySQL JOIN은 < > 연산자를 사용하여 WHERE 절을 필터링하지 않았습니다. (0) | 2023.01.24 |
---|---|
하나의 쿼리로 여러 행 삽입 MySQL (0) | 2023.01.24 |
다른 Vuex 모듈에서 변환 커밋 (0) | 2023.01.24 |
하이버네이트 HQL 결과를 사용하여 타입 안전 경고를 회피하는 방법 (0) | 2023.01.24 |
MySQL의 디스크 읽기 속도 저하 INSERT (0) | 2023.01.24 |