Question

我在Wordpress中使用require.js，并且我已经完成了从页面加载所有供应商和自定义脚本，除了一个文件......如果我尝试加载同位素。 pkgd.min＆＃39;通过require js，控制台显示错误：

jQuery(...).isotope is not a function

错误来自我在require.js中加载的文件，名为＆＃39; jquery.theme＆＃39;，执行此代码：

jQuery('.portfolio-isotope').isotope( 'layout' );
jQuery('.ajax-isotope').isotope( 'layout' );

首先我认为这是jquery duplicity的一个问题（因为有些插件使用自己的jquery版本而不是wp默认版本），但我解决了它，在require.js中使用配置jquery默认为wp，使用此代码：

if (typeof jQuery === 'function') {
    define('jquery', function () { return jQuery; });
}

但那，没有解决任何问题。我已经看到我是否离开了wp同位素默认调用，并且我使用require.js加载了另一个，默认的是body标签内部，并且需要的是在头部内部。也许将require.js放在body标签内可以解决问题？但不知道如何做到这一点。

我的require.js配置文件：

requirejs.config({
baseUrl: './wp-content/themes/alterna-child/assets/js/',
paths: {
    jquery_ui: 'vendor/jquery-ui/jquery-ui',
    jquery_ui_touch_punch: 'vendor/jquery-ui/jquery.ui.touch-punch.min',
    jquery_ui_slider_pips: 'vendor/jquery-ui/jquery-ui-slider-pips',
    bootstrap: 'vendor/bootstrap/bootstrap.min',
    isotope: 'vendor/isotope/isotope.pkgd.min',
    fancyBox_mousewheel: 'vendor/fancyBox/jquery.mousewheel-3.0.6.pack',
    fancyBox_js: 'vendor/fancyBox/jquery.fancybox.pack',
    fancyBox_helpers_js: 'vendor/fancyBox/helpers/jquery.fancybox-thumbs',
    flexslider_js: 'vendor/flexslider/jquery.flexslider-min',
    csstransforms3d: 'csstransforms3d',
    select: 'vendor/bootstrap-select/bootstrap-select'
},
shim: {
    'bootstrap': {
        deps: ['jquery']
    },
    'isotope': {
        deps: ['jquery']
    },
    'fancyBox_mousewheel': {
        deps: ['jquery']
    },
    'fancyBox_js': {
        deps: ['jquery']
    },
    'fancyBox_helpers_js': {
        deps: ['jquery']
    },
    'flexslider_js': {
        deps: ['jquery']
    },
    'csstransforms3d': {
        deps: ['jquery']
    },
    'jquery_ui': {
        deps: ['jquery']
    },
    'jquery_uitouch_punch': {
        deps: ['jquery','jquery_ui']
    },
    'jquery_ui_slider_pips': {
        deps: ['jquery','jquery_ui']
    },
    'select': {
        deps: ['jquery']
    }
}
});

if (typeof jQuery === 'function') {
    define('jquery', function () { return jQuery; });
}

requirejs(['jquery','bootstrap','isotope','fancyBox_mousewheel','fancyBox_js',
    'fancyBox_helpers_js','jquery_ui','jquery_ui_touch_punch','jquery_ui_slider_pips','select','jquery.theme'], function ($) {
        console.log("It works");
});

P.S：需要js文件通过＆＃39; functions.php＆＃39;中的函数加载到wp_footer中。儿童主题。

Wordpress + require.js jQuery（...）。同位素不是一个函数

0 个答案: