私は実際にSymfonyとそのWebpack:Webpack Encoreの(簡略化された)バージョンを使用してWebサイトを開発しています。Webpack EncoreビルドファイルからjQueryにアクセスできない
私のウェブサイトは、私は彼らのCDNからjQueryのをロードすることを好むだろう、これは私がやっているものを実際には、古典的な
$(document).ready(function(){ ... })(jQuery);
でのjQueryを使用して開始します唯一のJavascriptファイル、template.js
を、使用しています。ウェブパックを使用せずにjs/template.js
スクリプトをHTMLファイルにロードすると、すべて正常に動作します。
しかし、私はこの問題が発生し、build/app.js
にjs/template.js
ファイルの内容をコンパイルして出力するのWebPACKを伝え、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
注:を私はWebPACKのは道を見つけたと思いますこの実際のコードがjs/template.js
から提供されていることをブラウザコンソールに伝えますが、私はbuild/app.js
しか使用していないと心配しないでください。
問題は今、私のコードはjQueryにアクセスできないということです。 Webpackが外部にアクセスできないスコープ内でコードを囲むような場合です。
の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()メソッドを試してみましたapp.js
でいくつか変更されましたが、それでも動作しません。