lodash 和 wordpress 的 JavaScript 错误“_未定义”

Question

我的 WordPress 页面有问题 - 因为我总是收到此 JS 错误：

Uncaught ReferenceError: _ is not defined

它所引用的代码行是 _.noConflict();声明如下。然而，正如您所看到的，lodash 刚刚加载到它的正上方，并且应该提供 _ 变量。有什么想法为什么会发生这种情况吗？

<script type='text/javascript' defer src='https://website.com/wp-includes/js/dist/vendor/lodash.min.js'></script>
<script type='text/javascript'>
     window.lodash = _.noConflict();
</script>

我很感激任何提示

Answer 1

您正在延迟加载 lodash，这意味着它将等待加载，但您试图立即使用它。当第二部分运行时，lodash 尚未加载。

您需要停止推迟 lodash 加载，或者将第二段代码包装在某种就绪回调中，该回调在加载 lodash 之前不会运行。

Answer 2

尝试删除第一个脚本标签中的“defer”或将 defer 添加到第二个脚本标签。脚本标签中的“defer”意味着它在页面完成解析后执行。 这里有更详细的解释。

Answer 3

您可以

await

让lodash可用。

const sleep = (delay: number) => new Promise((resolve) => setTimeout(resolve, delay));
const getLodash = () =>
  new Promise(async (resolve) => {
    while (_ === undefined) {
      await sleep(100);
    }
    resolve(_);
  });
(async () => {
  window.lodash = await getLodash();
})();

Answer 4

在你的functions.php中使用下面的代码

wp_deregister_script( 'lodash' ); // remove default lodash from wordpress

wp_enqueue_script('lodash', get_template_directory_uri(  ).'/libs/lodash.min.js', array(), $version, true); // load lodash from file