Encore webpack问题，因为datepicker()不是一个函数。

Question

jquery-ui Datepicker widget在Encore webpack中无法使用，因为不是一个函数。

TypeError: $(...).datepicker is not a function

这是我的app.js:

global.$ = global.jQuery = $;
require('jquery-ui');
require('popper.js');
require('bootstrap');
require('bootstrap-table');
require('select2');
require('../lib/jquery-switchbutton/jquery.switchButton.js');
require('./bootstrap3-typeahead.min.js');

和webpack配置。

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

Encore
    .setOutputPath('public/build/')
    .setPublicPath('/build')
    .addEntry('app', './assets/js/app.js')
    .splitEntryChunks()
    .enableSingleRuntimeChunk()
    .cleanupOutputBeforeBuild()
    .enableBuildNotifications()
    .enableSourceMaps(!Encore.isProduction())
    .enableVersioning(Encore.isProduction())
    .autoProvideVariables({
        $: "jquery",
        jQuery: "jquery",
        Popper: ['popper.js', 'default']
    });

var config = Encore.getWebpackConfig();
config.resolve.alias = {
    jquery: path.join(__dirname, 'node_modules/jquery/dist/jquery')
};
module.exports = config;

任何解决方案？谢谢

Answer 1

根据Thins的文章 - https:/medium.commitchtalmadgedatetimepicker-is-not-a-function-webpack-fix-551177a11035。 - "问题是datetimepicker试图使用它自己的jquery版本，而其他所有的web应用程序使用的jquery版本是不同的 "为了使用本文的解决方案，你必须编辑一下你的 "datetimepicker"。webpack.config.js在它的最后，你应该替换成 module.exports = Encore.getWebpackConfig();由以下：`让config = Encore.getWebpackConfig()。

config.resolve.alias = {
    // Force all modules to use the same jquery version.
    'jquery': path.join(__dirname, 'node_modules/jquery/src/jquery')
};

module.exports = config;

如果需要的话再加到上面。

const path = require('path');

它帮助了我。