【WP】プレビュー画面に任意のJSやデータを送り込むサンプル

aaaa-class.php

class aaaa{
    public function __construct()
    {
        add_action('wp_head', array(
            $this,'register_preview_header'
        ));
    }

    public function register_preview_header()
    {
        if (! is_preview()) {
            return;
        }

        wp_enqueue_script('vue', plugins_url('js/vender-libs/vue.js', __FILE__));
        wp_enqueue_script('preview-editor', plugins_url('js/preview-editor.js', __FILE__));
        wp_localize_script('preview-editor', '_meta_post_data',
            array('article' => array(
                'description' => 'テスト'
            )
        ));
    }
}

preview-editor.js

if(undefined === _meta_post_data){ throw new Exception("_meta_post_data is not defined") } // check defined.

jQuery(function($){
  var entryContentVue = new Vue({
    el: 'article > .entry-content',
    template: '<div>これはVueで書き換えたものです. {{article.description}}</div>',
    data: _meta_post_data
  });
});