如何使用CDN在不使用NPM的情况下将Table插件添加到CKEDITOR 5文档已解耦中?

问题描述

我正在尝试插入(生成)表并设置其样式,但是找不到它的CDN网址 如何将插件导入 ckeditor 5

github 下载插件后,我分别导入了一些.js文件,但它们也依赖于其他文件

插件是否独立工作:没有Node Js或任何SPA Js框架?

(function () {
    'use strict';
    // import Table from '/templates/ty/js/ckeditor5-build-decoupled-document/ckeditor5-table-master/src/table.js';
    // import Tabletoolbar from '/templates/ty/js/ckeditor5-build-decoupled-document/ckeditor5-table-master/srctabletoolbar.js';

    DecoupledEditor
        .create(document.querySelector('#editor'),{

            language: 'ru'

        })
        .then(editor => {
            const toolbarContainer = document.querySelector('#toolbar-container');

            toolbarContainer.appendChild(editor.ui.view.toolbar.element);
        })
        .catch(error => {
            console.error(error);
        });
    // function CustomizationPlugin(editor) {
    // }
})();
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>

<script src="https://cdn.ckeditor.com/ckeditor5/23.0.0/decoupled-document/ckeditor.js"></script>

<div class=" editor-container">
        <div class="card ">
            <div id="toolbar-container"></div>
            <div id="editor" name="editor">
                <div style="background-color: #efefef">
                    <div id="hideBorderOnPrint">
                        <div class="template-body">
                            <div class="text-center"><b>ОСМОТР КАРДИОЛОГА</b></div>

                            <div>Дата: <br />
                                ФИО пациента: o&#39;g&#39;li</div>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>Жалобы:</b></td>
                                        <td id="list-жалобы">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>2. Анамнез жизни:</b></td>
                                        <td id="list-Анамнез_жизни">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>3. Обследование инструментальное:</b></td>
                                        <td id="list-Обсл_инстр">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>4. ЭКГ от 2019г</b></td>
                                        <td id="list-ЭКГ">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>5. ЭХО-КГ от </b></td>
                                        <td id="list-ЭХО_КГ">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <table class="leftWidthAuto">
                                <tbody>
                                    <tr>
                                        <td><b>6. Обследование:</b></td>
                                        <td id="list-Обследование">&nbsp;</td>
                                    </tr>
                                </tbody>
                            </table>

                            <div>&nbsp;</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)