symfony - Cannot acces jQuery from Webpack Encore build file -
i developping website using symfony, , (simplified) version of webpack : webpack encore.
my website using 1 javascript file, template.js, uses jquery , begins classic
$(document).ready(function(){ ... })(jquery); i prefer load jquery cdn, , doing. if load js/template.js script html file without using webpack, works fine.
but, if tell webpack compile , output js/template.js file content build/app.js , include in html file, happens :
uncaught typeerror: $ not function @ template.js:12 @ object.<anonymous> (template.js:11) @ object../assets/js/template.js (app.js:1898) @ __webpack_require__ (bootstrap 405ca97655117f294089:19) @ object.0 (jquery.js:10253) @ __webpack_require__ (bootstrap 405ca97655117f294089:19) @ bootstrap 405ca97655117f294089:62 @ bootstrap 405ca97655117f294089:62 note: think webpack finds way tell browser console actual code provides js/template.js, don't worry using build/app.js.
so problem now, code cannot access jquery. it's if webpack surround code in scope cannot access outside.
webpack adds code before inserting content of template.js in app.js, , here how begins inserting :
/***/ "./assets/js/template.js": /*!*******************************!*\ !*** ./assets/js/template.js ***! \*******************************/ /*! no static exports found */ /*! exports used */ /***/ (function(module, exports) { (function ($) { $(document).ready(function () { if ($('.boxed .fullscreen-bg').length > 0) { $("body").addclass("transparent-page-wrapper"); }; finally, tried .autoprovidejquery() method encore, changes things in app.js still doesn't work.
the script couldn't access jquery because of this.jquery
(function($){ $(document).ready(function(){ ... }); })(**this.**jquery); replace jquery
Comments
Post a Comment