无法读取未定义的属性“速度”

Question

我有一个问题，在 wordpress 上，在使用 Velocity js 上。

在 function.php 中，我将velocity.min.js 和velocity.ui.min.js 排入队列，就像这样

wp_enqueue_script('velociti-min-js', STYLESHEET_URI . '/assets/js/velocity.min.js', array('jquery'), THEME_VERSION, true);
wp_enqueue_script('velociti-ui-min-js', STYLESHEET_URI . '/assets/js/velocity.ui.min.js', array('jquery'), THEME_VERSION, true);

然后我用我的自定义 javascript 代码将 main.js 文件排入队列

wp_enqueue_script('main-theme-function', STYLESHEET_URI . '/assets/js/main-theme-function.js', NULL, THEME_VERSION, TRUE);

当我尝试注册一个新的速度效果时，比如

$.Velocity
.RegisterEffect("myeffect", {
    defaultDuration: 1,
    calls: [ 
        [ { translateY: '-50%'}, 1]
    ]
});

我在控制台上收到此错误

未捕获的类型错误：无法读取未定义的属性“速度”

但我不明白为什么...有人可以帮忙吗？

非常感谢

Answer 1

未捕获的类型错误：无法读取未定义的属性“速度”

在你的情况下意味着“$”（JQuery）没有价值。

主要是因为 JQuery 没有添加到您身边或 Velocity 库之后。 确保先加载/添加 Jquery，然后再加载 Velocity。

但不知道如何在 wordpress 中使用。

Answer 2

您应该尝试改用jQuery.Velocity。或者，您可以将调用包装在一个 IIFE 中，该 IIFE 将 jQuery 别名为$。

(function ($) {
    // $.Velocity...
})(jQuery);

Answer 3

这很可能是加载顺序错误。除非您添加依赖参数，否则 WP 会以一种随机顺序加载 JS 文件。

您需要将您的 velocity js 文件作为依赖项添加到您的 main.js。

wp_enqueue_script('velociti-min-js', STYLESHEET_URI . '/assets/js/velocity.min.js', array('jquery'), THEME_VERSION, true);
wp_enqueue_script('velociti-ui-min-js', STYLESHEET_URI . '/assets/js/velocity.ui.min.js', array('jquery', 'velocity-min-js'), THEME_VERSION, true);
wp_enqueue_script('main-theme-function', STYLESHEET_URI . '/assets/js/main-theme-function.js', ['velociti-min-js', velociti-ui-min-js'], THEME_VERSION, TRUE);

我用数组['velociti-min-js', velociti-ui-min-js'] 替换了您队列中的NULL - 您使用为脚本设置的标签作为值。这将确保这些文件在您的主 js 之前加载。