时间戳

首页 > 解决方案 > 如何修复“未捕获的语法错误：意外的令牌导入”（jQuery、Wordpress）？

jquery - 如何修复“未捕获的语法错误：意外的令牌导入”（jQuery、Wordpress）？

问题描述

我$从Wp中的jQuery导入了一个搜索按钮并得到了 Uncaught

SyntaxError：意外的令牌导入。

我改用了jQuery这个词$，控制台是空的，但代码仍然不起作用。我做错了什么？

HTML 按钮

    <span class="search-trigger js-search-trigger"><i class="fa fa-search" aria-hidden="true"></i></span>

JS

    import $ from 'jquery';
class Search {
// 1. Describe, create, initiate our object
constructor(){
    this.openButton = $(".js-search-trigger");
    this.closeButton = $(".search-overlay__close");
    this.searchOverlay = $(".search-overlay");
    this.events();
} // 2.events
events(){
this.openButton.on("click", this.openOverlay.bind(this));
this.closeButton.on("click", this.closeOverlay.bind(this));
}// 3. methods (function, action...)
    openOverlay(){
    this.searchOverlay.addClass("search-overlay--active");
} 
closeOverlay(){
    this.searchOverlay.removeClass("search-overlay--active");
}    
}

函数.php

    wp_enqueue_script('script', 
    get_theme_file_uri('/js/modules/search.js'),                      
    array('jquery'), microtime(), true);

预期结果 - 点击搜索标志，它会显示带有搜索输入的弹出窗口。点击关闭标志，它会关闭。

实际结果 - 没有任何反应。控制台错误未捕获SyntaxError: Unexpected token import.

标签： jquerywordpress

解决方案

尝试将 jQuery 作为文件或其他方法（如 require）导入。您的环境似乎不支持导入令牌。

此外，如果您要在 Web 浏览器中使用该文件而不是 PHP 依赖项来填充大多数 Web 浏览器不支持的内容，请使用 ES5 语法而不是最新的语法。

推荐阅读