Symfony 3.3帶encore的前端堆棧 - 全局jquery插件

我試圖用物化css框架製作symfony應用程序。根據官方3.3文檔，我使用encore來前端。Symfony 3.3帶encore的前端堆棧 - 全局jquery插件

我有一個全球jquery插件的問題。我想這： Webpack Encore - jQuery plugins out of view這仍然沒有工作...

所以...... 我的WebPack配置：

var Encore = require("@symfony/webpack-encore"); 
var webpack = require('webpack'); 

Encore 
    .setOutputPath('web/build/') 
    .setPublicPath('/build') 
    .cleanupOutputBeforeBuild() 
    .autoProvidejQuery() 
    .createSharedEntry('vendor', [ 
     'materialize-css', 
     './assets/js/global.js', 
    ]) 

    .addStyleEntry('global', './assets/scss/global.scss') 
    .addEntry("createProfileModule", "./assets/js/modules/createProfile.js") 

    .enableSassLoader() 
    .enableSourceMaps(!Encore.isProduction()) 
    .enableVueLoader() 
    .addPlugin(new webpack.ProvidePlugin({ 
     $: 'jquery', 
     jQuery: 'jquery', 
     'window.jQuery': 'jquery', 
     Popper: ['popper.js', 'default'], 
     // In case you imported plugins individually, you must also require them here: 
     Util: "exports-loader?Util!bootstrap/js/dist/util", 
     Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown", 
    })) 
    .enableVersioning() 
; 

module.exports = Encore.getWebpackConfig();

在

vendor.js我包括global.js ：

$(document).ready(() => { 
    $('.modal').modal(); 
    $(".modal .close-btn").on("click",() => { 
     $('.modal').modal('close'); 
    }); 

    $(".button-collapse").sideNav(); 

    $("#registerModal form").submit((e) => { 
     e.preventDefault(); 

     $(".modal .progress").fadeIn().promise().done(() => { 
      setTimeout(() => { 
       window.location = "/stworz-profil"; 
      }, 2500) 
     }) 
    }); 
});

在這個文件中，任何jquery插件工作正常。在createProfile.js：

$('input.autocomplete').autocomplete({ 
    data: { 
     "Gdańsk": null, 
     "Gdynia": null, 
     "Sopot": null, 
     "Warszawa": null, 
    }, 
    limit: 20, 
    onAutocomplete: function(val) { 

    }, 
    minLength: 1, 
});

，當我在控制檯加載頁面我看到：

Uncaught TypeError: $(...).autocomplete is not a function 
    at Object../assets/js/modules/createProfile.js (createProfileModule.61543364cceab7b76d2b.js:13) 
    at __webpack_require__ (manifest.d41d8cd98f00b204e980.js:55) 
    at webpackJsonpCallback (manifest.d41d8cd98f00b204e980.js:26) 
    at createProfileModule.61543364cceab7b76d2b.js:1

如何提供的jQuery在全球的插件？

來源

2017-08-22 Filip Nowacki

好的，幾次嘗試後，我明白了。

解決方案是在自動完成之前添加$（document）.ready

來源

2017-08-22 12:55:32

Symfony 3.3帶encore的前端堆棧 - 全局jquery插件

回答

相關問題