Laravel 5의 자산 관리

Question

Laravel 5에서 자산 관리에 대한 올바른 접근법을 설명 할 수 있습니까? 예를 들어, bower를 사용하여 일부 플러그인을 설치하려고한다고 가정 해 봅시다. 모든 파일을 /vendor/bower_components으로 유지하는 것이 좋습니다. 그래서 몇 가지 CSS, 일부 이미지, 글꼴 및 자바 스크립트 파일 withing 플러그인.

또한 "app.less"가 있는데, 내가 필요한 모든 것을 가져 오는 곳은 @import ('../../../vendor/bower_components/someplugin/somestyle.css')입니다. 문제는 내가 공용 디렉토리에 images/js/fonts가 없다는 것입니다. 좋아, 꿀꺽 꿀꺽 사용할 수있는 걸 봤어 copy 기능. 그러나 플러그인 수가 증가하면 각 플러그인이 사진이나 다른 파일을 보관하는 위치를 어떻게 관리해야합니까?

사실 저는 시맨틱 UI를 사용하고 싶었습니다. 나는 그것을 배수로 다운로드했다. semantic-ui에 대해서는 아무 것도 모르지만 semantic-ui.css가있는 dist 폴더가 있습니다. 또한 themes/basic/assets/fonts 글꼴 파일이 있습니다. 공개로 복사하면 public/themes/basic/assets/fonts이됩니다. 그런 다음 semantic-ui.css를 내 app.les로 가져오고 필요한 글꼴을 찾습니다. 다른 플러그인이 있으면 그것을 모두 관리하는 것이 참기 어려울 것입니다.

이 문제의 일반적인 워크 플로는 무엇입니까? 가장 간단한 방법은 모든 것을 공개하고 <link> 및 <script> 태그를 사용하여 수동으로 포함하는 것과 비슷하지만 많은 쿼리가 필요합니다.

왜 모든 bower_components를 공개하지 않는 것이 좋지 않습니까? 작곡가와 유사하게, 우리는 잔디 깎기 용 오토로더가 없으므로 자산이 엉망입니다.

Answer 1

bower_components를 설치하는 것이 좋습니다. bower_components를 공용 디렉토리에 두는 것은 권장하지 않습니다. HTML에 포함해야하는 파일뿐만 아니라 특정 패키지의 모든 파일을 포함하기 때문입니다.

Laravel5에 대해 이야기 한 결과 laravel-elixir를 사용하여 자산을 관리하는 것이 좋습니다. 은 꿀꺽 꿀꺽 마시는 것을 이용하고 더 적은, 저음 또는 다양한 다른 파일을 컴파일 할 수 있습니다. 필자는 시맨틱 UI에 대한 경험이 없지만 부트 스트랩과 비슷한 것으로 보인다. npmjs.org에서 SaaS 또는 Less 버전을 사용할 수 없으면 필요한 파일을 공용 디렉토리에 복사해야합니다. Elixir는 bower_components에서 공용 디렉토리로 파일 또는 전체 디렉토리를 복사하는 간단한 방법을 제공합니다.

필요없이 모든 파일을 포함하는 가장 쉬운 방법은 saas 이하를 사용하는 것입니다.

Answer 2

Personally what I do is this using node 


var elixir = require('laravel-elixir'); 

var nodeDir = './node_modules/'; //This is the node directory(base directory) where all vendor files are downloaded in your case might be different 

/* 
|-------------------------------------------------------------------------- 
| Elixir Asset Management 
|-------------------------------------------------------------------------- 
| 
| Elixir provides a clean, fluent API for defining some basic Gulp tasks 
| for your Laravel application. By default, we are compiling the Sass 
| file for our application, as well as publishing vendor resources. 
| 
*/ 
elixir(function(mix) { 
mix the styles and copy fonts to my public/css folder 

    mix.styles([ 
     'bootstrap/dist/css/bootstrap.css', 
     'font-awesome/css/font-awesome.css' 
    ], './public/css/app.css', nodeDir) 
     .copy(nodeDir + 'font-awesome/fonts', 'public/fonts') 
     .copy(nodeDir + 'bootstrap/fonts', 'public/fonts'); 

//mix javascript from node directory and output to public/js/ folder 

    mix.scripts([ 
     'jquery/dist/jquery.js', 
     'bootstrap/dist/js/bootstrap.js' 

    ], './public/js/app.js', nodeDir); 


});