温馨提示:本文翻译自stackoverflow.com，查看原文请点击：php - Laravel CKEditor5
ckeditor5 laravel laravel-6 php webpack

php - Laravel CKEditor5

发布于 2020-05-04 01:23:18

由于unisharp/laravel-ckeditor与Laravel 6的依赖项不兼容，我想在Laravel应用程序中替换旧版本的CKEditor 。我发现CKEditor 5页面包含NPM安装说明，但未能使其正常运行。这是我的代码：

resources/main.js

require('@ckeditor/ckeditor5-build-classic');

$(document).ready(function(){
  ClassicEditor.create($('#edit_about_text').get()[0]);
});

webpack.mix.js

mix.js('resources/assets/js/main.js', 'public/js');

layouts/master.blade.php

<!doctype html>
<html>
  <head></head>
<body>
  <script src="{{ asset('js/main.js') }}"></script>
</body>
</html>

jQuery已包含（以某种方式；有些不熟悉webpack），但是运行扩展页面会@extends('layouts.master')导致以下结果：

未捕获的ReferenceError：未定义ClassicEditor

如果我require()从中删除该语句main.js并仅使用CDN链接，那么一切都会按预期进行：

<script src="https://cdn.ckeditor.com/ckeditor5/16.0.0/classic/ckeditor.js"></script>
<script src="{{ asset('js/main.js') }}"></script>

我做错了事，但我很茫然...以前有没有人看过这个问题？

查看更多

提问者
Tim Lewis
被浏览
6
分享
Tim Lewis 2020-02-15 05:12

文档无法引用的很简单的解决方案，但是您需要将to的值分配require()给ClassicEditor：

var ClassicEditor = require('@ckeditor/ckeditor5-build-classic');

这样做可以正确引用代码。

热门帖子

1
96年 一无所有 该学点什么养家糊口了
2
Authing 真是一家神奇牛逼的公司！
3
项目寻找 UI 设计与前端开发外包
4
电脑内存都被谁占了
5
自己写的拯救者笔记本风扇命令行控制软件 欢迎 star 和反馈使用问题
6
使用 flutter+goframe 实现了一个旅游攻略 app，现在内测开启！
7
有搞过便利店的朋友吗
8
广州有老哥出可以多播的宽带么
9
读论文的一些心流体验和挫败感
10
2024 年 9 月份入园价格北京昌平霍营附近某普惠幼儿园

相关问题

1
通过使用Ajax单击不带提交按钮的复选框来更新sql数据库
2
在Laravel中输入文字时如何附加？
3
Directus计算的字段/列
4
如何使用php和mysql为用户计数消息
5
如何删除数组元素，然后重新索引数组？
6
计算日期之间的工作日
7
如何在MySQL语句中包含PHP变量
8
是否可以创建SQL表并同时插入数据？
9
“ zend_mm_heap损坏”是什么意思
10
语法错误，意外令牌“

热门github

1
Implementation of paper - YOLOv9: Learning What You Want to Learn Using Programmable Gradient Information (翻译：论文实现——YOLOv9: Learning What You Want to Learn using Programmable Gradient Information（利用可编程梯度信息学习您想学的内容）)
2
A Windows and Office activator using HWID / Ohook / KMS38 / Online KMS activation methods, with a focus on open-source code and fewer antivirus detections. (翻译：使用 HWID / KMS38 / Online KMS 激活方法激活 Microsoft 产品的脚本集合，重点是开源代码、较少的防病毒检测和用户友好性。)
3
Get up and running with Llama 2, Mistral, Gemma, and other large language models. (翻译：启动并运行 Llama 2、Mistral、Gemma 和其他大型语言模型。)
4
该项目可以让你通过订阅的方式使用Cloudflare WARP+，自动获取流量。This project enables you to use Cloudflare WARP+ through subscription, automatically acquiring traffic.
5
Multi functional app to find duplicates, empty folders, similar images etc. (翻译：多功能应用程序可查找重复项、空文件夹、相似图像等。)
6
Xray panel supporting multi-protocol multi-user expire day & traffic & ip limit (Vmess & Vless & Trojan & ShadowSocks & Wireguard) (翻译：Xray面板支持多协议多用户到期日&流量&IP限制（Vmess & Vless & Trojan & ShadowSocks & Wireguard)
7
The Free Software Media System (翻译：Jellyfin 是一个免费软件媒体系统，可让您控制管理和流式传输您的媒体。它是专有 Emby 和 Plex 的替代方案，通过多个应用程序从专用服务器向最终用户设备提供媒体。)
8
lightweight, standalone C++ inference engine for Google's Gemma models. (翻译：适用于 Google Gemma 模型的轻量级独立 C++ 推理引擎。)
9
📚 Freely available programming books (翻译：📚 免费提供的编程书籍)
10
A collective list of free APIs (翻译：免费 API 的集合列表)
11
1️⃣🐝🏎️ The One Billion Row Challenge -- A fun exploration of how quickly 1B rows from a text file can be aggregated with Java (翻译：十亿行挑战 —— 使用 Java 对文本文件中的 10 亿行数据进行聚合的有趣探索)
12
🎓 Path to a free self-taught education in Computer Science! (翻译：🎓计算机科学免费自学教程！)
13
Curso para aprender el lenguaje de programación Python desde cero y para principiantes. 75 clases, 37 horas en vídeo, código, proyectos y grupo de chat. Fundamentos, frontend, backend, testing, IA... (翻译：从零开始学习 Python 编程语言的课程，适合初学者)
14
This repository contains System Design resources which are useful while preparing for interviews and learning Distributed Systems (翻译：该存储库包含系统设计资源，在准备面试和学习分布式系统时非常有用)
15
Mamba is a new state space model architecture showing promising performance on information-dense data such as language modeling, where previous subquadratic models fall short of Transformers. It is based on the line of progress on structured state space models, with an efficient hardware-aware design and implementation in the spirit of FlashAttention. (翻译：Mamba 是一种新的状态空间模型架构，在信息密集型数据（例如语言建模）上显示出良好的性能，而之前的二次模型在 Transformers 方面存在不足。它基于结构化状态空间模型的进展，并本着FlashAttention的精神进行高效的硬件感知设计和实现。)