Пользовательский блок Wordpress Gutenberg, viewScript не загружается во внешнем интерфейсе, когда мой блок вставлен

Недавно я разработал собственный блок Гутенберга, используя пакет @wordpress/create-block, который эффективно создал полную структуру плагинов. Мне просто нужно было настроить некоторые существующие файлы, чтобы основные функции работали.

Этот блок представляет собой главный/визуальный тип, в котором пользователи могут выбирать изображения и добавлять заголовки для каждого слайда. Блок правильно отображается во внешнем интерфейсе, демонстрируя все выбранные изображения и заголовки.

Моя текущая задача — реализация JavaScript для включения функциональности карусели. Однако я столкнулся с проблемой, из-за которой мой viewScript (указанный как «file:./view.js») не загружается во внешнем интерфейсе. Под отсутствием загрузки я подразумеваю, что сценарий не отображается в разметке HTML или на вкладке сети.

Вот содержимое моего файла block.json, расположенного в папке сборки:

{
  "$schema": "https://schemas.wp.org/trunk/block.json",
  "apiVersion": 3,
  "name": "custom-block/hero",
  "version": "0.1.0",
  "title": "Hero",
  "category": "widgets",
  "icon": "smiley",
  "description": "Custom hero block",
  "attributes": {
    "images": {
      "type": "array",
      "source": "query",
      "default": [],
      "selector": "img",
      "query": {
        "url": {
          "type": "string",
          "source": "attribute",
          "attribute": "src"
        },
        "alt": {
          "type": "string",
          "source": "attribute",
          "attribute": "alt"
        },
        "caption": {
          "type": "string",
          "source": "attribute",
          "attribute": "data-caption"
        }
      }
    }
  },
  "supports": {
    "html": false
  },
  "textdomain": "hero",
  "editorScript": "file:./index.js",
  "editorStyle": "file:./index.css",
  "style": "file:./style-index.css",
  "viewScript": "file:./view.js",
  "viewStyle": "file:./view.css"
}

Вы можете проверить наличие view.js в папке сборки моего плагина прямо здесь, в реальном репозитории.

Основной файл плагина, Hero.php, не использует функцию render_callback, поэтому я предположил, что нет необходимости вручную ставить скрипты в очередь. Вот как это выглядит:

/**
 * Plugin Name:       Hero
 * Description:       Custom hero block.
 * Requires at least: 6.1
 * Requires PHP:      7.0
 * Version:           0.1.0
 * Author:            Daniel
 * License:           GPL-2.0-or-later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:       hero
 *
 * @package CreateBlock
 */

if ( ! defined( 'ABSPATH' ) ) {
  exit; // Exit if accessed directly.
}

function create_block_hero_block_init() {
  register_block_type( __DIR__ . '/build' );
}

add_action( 'init', 'create_block_hero_block_init' );

Несмотря на правильное добавление блока и сохранение страницы, скрипт view.js остается незамеченным на веб-интерфейсе. Я искал в Интернете решения, но, похоже, у других оно работает. Могу ли я пропустить важный шаг?

Заранее спасибо за любые рекомендации.

Вы также можете разместить сообщение на wordpress.stackexchange.com

j08691 02.05.2024 19:24
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
1
217
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Задача решена. Если у кого-то такая же проблема, как у меня, зайдите в файл *.php, в котором вы пытаетесь отобразить блок. Убедитесь, что вы используете the_content() для отображения содержимого страницы, а не get_the_content().

Другие вопросы по теме