时间戳

首页 > 解决方案 > 使用 webpack 在 Laravel 5 中将插件安装到 CKEditor 5

javascript - 使用 webpack 在 Laravel 5 中将插件安装到 CKEditor 5

问题描述

我在将插件安装到集成到 Laravel 5.6 的 CKEditor 时遇到了一个小问题。根据 CKEditor 文档的集成指南，我能够@ckeditor/ckeditor5-build-classic使用 npm 将依赖项添加到项目中，并且它与 webpack 一起工作得很好。

但问题是我无法添加默认情况下不包含在 CKEditor 中的自定义插件。我正在按照指南添加自定义插件，但在 laravel 本身中使用 webpack 并不能很好地工作。例如，我尝试添加@ckeditor/ckeditor5-alignment，但没有成功，并且出现以下控制台错误。

TypeError: Cannot read property 'getAttribute' of null

我想这可能是我在设置 ClassicEditor 实例时没有添加所有必要的插件。所以我尝试了另一件事。我已将插件安装到 ckeditor build 并获得了自定义版本。但是，当我尝试使用以下语句在自定义路径中导入构建时，它并没有导入。

import ClassicEditor from '../plugins/vendor/ckeditor/build/ckeditor';

如果我只是从 node_modules 中删除构建目录并复制此自定义构建，则可以使用以下语句使其工作。

import ClassicEditor from '@ckeditor/ckeditor5-build-classic/build/ckeditor';

这不是在 node_modules 中编辑/更新的专业方法。

所以我的问题是：

如何在 Laravel 本身上将自定义插件安装到 CKEditor？

或者如何在不自定义 node_modules 的情况下将自定义 CKEditor 构建添加到项目中？

标签： javascriptlaravelwebpackckeditor

解决方案

我在我的 Laravel 项目中使用过 CKEditor 等，但我是这样做的：

  1. 我从 CKEditor 网站下载了 js 和 CSS 文件并解压缩文件
  2. 我将这些文件复制到我的 Laravel 项目的公共文件夹中
  3. 您可以像这样在刀片页面中访问和使用它们
<code>
   <script src="{{asset('js/ckeditor.js')}}"></script>
   <link rel="stylesheet: href="{{asset('js/ckeditor.js')}}" />
</code>

推荐阅读