2013-09-06 2 views
2

내 Gruntfile.js 이미지의 회전 작업을 포함, 마녀 괜찮 :gruntjs - 액세스 계 (ED) 자바 스크립트에서 이미지가

rev: { 
    dist: { 
     files: { 
      src: [ 
       '<%= yeoman.dist %>/scripts/{,*/}*.js', 
       '<%= yeoman.dist %>/styles/{,*/}*.css', 
       '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}', 
       '<%= yeoman.dist %>/styles/fonts/{,*/}*.*' 
      ] 
     } 
    } 
}, 

지금 여기 내 응용 프로그램에서 내 자바 스크립트 코드입니다 :

require(['app', 'jquery', 'jqueryBackstretch'], function (app, $) { 
    'use strict'; 
    // use app here 
    // console.log(app); 
    // console.log('Running jQuery %s', $().jquery); 
    $(function() { 
     $('.stretch').backstretch(
      [ 
       'images/interieur.jpg', 
       'images/10.jpg', 
       'images/11b.jpg', 
       'images/axo 02.jpg', 
       'images/axo 03.jpg' 
      ], 
      {duration: 4000, fade: 'slow'} 
     ); 
    }); 
}); 

리비전 작업이 실행 된 후에도 내 이미지 파일에 액세스 할 수 있습니까? 그래도 '싹둑 서버'모드에서 해당 파일에 액세스 할 수 있습니까?

감사합니다. 자비에르

답변

1

usemin를 사용하여 시도 적이 있습니까? 일반적으로 원래 파일 이름을 축소/revved /로 바꾸는 것이 작업입니다. 버전

usemin은 일반적으로 CSS 및 HTML 파일 만 대상으로하지만 구성을 편집하면 js 파일도 구문 분석 할 수 있어야합니다.

모르겠다. 작동하지 않으면 사용자가 이미지를 다운로드 할 것이므로 해커가 주위에있는 이미지를 class="special-class"과 함께 추가하면됩니다. jQuery로 선택하고 display:none;도 수행하십시오. 이러한 이미지는 업데이트 소스 것 그리고 당신은이 방법을 수행 한 후 수 : 완벽과는 거리가 멀다

require(['app', 'jquery', 'jqueryBackstretch'], function (app, $) { 
    'use strict'; 

    $(function() { 
     var images = []; 
     $('.special-class').each(function() { 
      images.push($(this).attr('src')); 
     }); 
     $('.stretch').backstretch(
      images, 
      {duration: 4000, fade: 'slow'} 
     ); 
    }); 
}); 

을하지만 usemin과 주위에 당신의 방법을 얻을 수없는 경우, 적어도이 작동합니다.

+0

나는 내 대답을 usemin을 사용하여 찾지 못했습니다. 그것은 단지 여기있는 것처럼 보이지 않습니다. 솔루션이 제대로 작동하여 이미지가 두 번로드되지 않았는지 확인해야했습니다. 감사. – XavRsl

관련 문제