2017-09-11 26 views
1

사실 Symfony와 Webpack Encap의 단순화 된 버전을 사용하여 웹 사이트를 개발하고 있습니다.Webpack Encore 빌드 파일에서 jQuery에 액세스 할 수 없습니다.

내 웹 사이트는 내가 그들의 CDN에서 jQuery를로드하는 것을 선호 고전

$(document).ready(function(){ ... })(jQuery); 

와 jQuery를 사용하고 시작하는 단 하나의 자바 스크립트 파일, template.js을 사용

, 이것은 내가 뭐하는 거지 사실이다. 어떤 웹팩을 사용하지 않고 js/template.js 스크립트를 HTML 파일에로드하면 모든 것이 잘 동작합니다.

하지만, 내가 build/app.jsjs/template.js 파일 내용을 컴파일하고 출력 할 웹팩을 말해 HTML 파일에 포함하는 경우, 이러한 상황이 발생 :

Uncaught TypeError: $ is not a function 
    at template.js:12 
    at Object.<anonymous> (template.js:11) 
    at Object../assets/js/template.js (app.js:1898) 
    at __webpack_require__ (bootstrap 405ca97655117f294089:19) 
    at Object.0 (jquery.js:10253) 
    at __webpack_require__ (bootstrap 405ca97655117f294089:19) 
    at bootstrap 405ca97655117f294089:62 
    at bootstrap 405ca97655117f294089:62 

참고 : 내가 생각이 웹팩는 방법을 찾아 이 실제 코드가 js/template.js에서 제공한다는 것을 브라우저 콘솔에 알리려고해도 build/app.js 만 사용하기 때문에 걱정하지 않아도됩니다.

이제 문제는 내 코드가 jQuery에 액세스 할 수 없다는 것입니다. Webpack이 외부에 액세스 할 수없는 범위에서 코드를 둘러싸는 것과 같습니다.

웹팩는 app.js에 template.js의 내용을 삽입하기 전에 몇 가지 코드를 추가하고 여기에 실제로 삽입하기 시작하는 방법입니다

/***/ "./assets/js/template.js": 
/*!*******************************!*\ 
    !*** ./assets/js/template.js ***! 
    \*******************************/ 
/*! no static exports found */ 
/*! all exports used */ 
/***/ (function(module, exports) { 

(function ($) { 
    $(document).ready(function() { 

     if ($('.boxed .fullscreen-bg').length > 0) { 
      $("body").addClass("transparent-page-wrapper"); 
     }; 

을 마지막으로, 내가 앙코르, 그것에서 .autoProvideJquery() 메소드를 시도 에서 몇 가지 사항을 변경했지만 여전히 작동하지 않습니다.

답변

0

스크립트는 jQuery

으로 바꾸기 때문에 this.jQuery

(function($){ 

    $(document).ready(function(){ 
     ... 
    }); 

})(**this.**jQuery); 

의 jQuery를 액세스 할 수 없습니다