使用 webpack 将插件安装到 Laravel 5 中的 CKEditor 5 [英] Installing plugins to CKEditor 5 in Laravel 5 with webpack

问题描述

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

I have got a small issue with installing plugins to CKEditor integrated to Laravel 5.6. According to integration guide from CKEditor document, I was able to add @ckeditor/ckeditor5-build-classic dependency using npm to the project and it was working just fine with webpack.

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

But the problem is that I can't add custom plugin which is not included to the CKEditor by default. I'm following the guide to add custom plugin but it's not really working fine with webpack in laravel itself. For example, I tried to add @ckeditor/ckeditor5-alignment, but didn't work and I got the following console error.

TypeError: Cannot read property 'getAttribute' of null

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

I guess this could be something that I have not added all necessary plugins when setup ClassicEditor instance. So I tried another thing. I have installed the plugin to ckeditor build and I got the custom build. But when I'm trying to import the build in the custom path with the following statement, it's not importing.

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

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

If I just remove build directory from node_modules and copy this custom build, I am able to make it work with the following statement.

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

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

This is not a professional way to edit/update in node_modules.

所以我的问题是:

如何在 Laravel 上为 CKEditor 安装自定义插件?

How can I install custom plugin to CKEditor on Laravel itself?

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

Or how can I add the custom CKEditor build to the project without customizing node_modules?

推荐答案

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

I have used CKEditor among others in my Laravel projects, but here is how I went about it:

1. 我从 CKEditor 网站下载了 js 和 CSS 文件并解压了文件
2. 我将这些文件复制到 Laravel 项目的公共文件夹中
3. 您可以像这样在刀片页面中访问和使用它们

<code>
   <script src="{{asset('js/ckeditor.js')}}"></script>
   <link rel="stylesheet: href="{{asset('js/ckeditor.js')}}" />
</code>

这篇关于使用 webpack 将插件安装到 Laravel 5 中的 CKEditor 5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！