集成github上的ueditor百度富文本编辑器

最新推荐文章于 2024-06-25 09:02:21 发布

榆落同学

最新推荐文章于 2024-06-25 09:02:21 发布

阅读量678

点赞数 1

分类专栏：前端文章标签：前端 js html

本文链接：https://blog.csdn.net/weixin_42190521/article/details/116563804

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

下载ueditor

官方下载：https://github.com/fex-team/ueditor#ueditor

clone或解压后目录如下

安装node.js

官方下载：https://nodejs.org/en/download/

选择自己对应的版本安装，我选择的是win64 .msi，相同版本的小伙伴可以从网盘获取，官网下载速度实在感人

网盘链接：https://pan.baidu.com/s/1DjGUM_ee-nrbEqfEHG2Pkw

提取码：egss

一路傻瓜式next安装完成后，目录如下

命令窗运行npm -v，显示版本号表示安装成功

C:\Users\yuluo>npm -v
6.14.12

之前安装过node.js的小伙伴，切记要升级到最新的版本，不然之后安装grunt会有问题，升级命令如下

npm update -g npm

安装grunt-cli

将grunt命令行安装到全局环境中

C:\Users\yuluo>npm install -g grunt-cli

命令窗运行grunt -version，显示版本号表示安装成功

C:\Users\yuluo>grunt -version
grunt-cli v1.4.2

打包成部署版本

进入到ueditor目录，安装依赖

F:\ueditor\\ueditor-dev-1.5.0>npm install

开始打包

F:\ueditor\ueditor-dev-1.5.0>grunt default

打包成功后，在ueditor目录内会生成一个dist目录

dist / utf8-php里的内容就是实际要用的

官方演示demo

在实际部署目录内创建demo.html文件，填入下面的html代码

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>ueditor demo</title>
</head>
<body>
	<!-- 加载编辑器的容器 -->
	<script id="container" name="content" type="text/plain">这里写你的初始化内容</script>
	<!-- 配置文件 -->
	<script type="text/javascript" src="ueditor.config.js"></script>
	<!-- 编辑器源码文件 -->
	<script type="text/javascript" src="ueditor.all.js"></script>
	<!-- 实例化编辑器 -->
	<script type="text/javascript">
	    var ue = UE.getEditor('container');
	</script>
</body>
</html>

用浏览器打开demo.html，大功告成！

榆落同学

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
集成github上的ueditor百度富文本编辑器

目录下载ueditor安装node.js安装grunt-cli打包成部署版本官方演示demo下载ueditor官方下载：https://github.com/fex-team/ueditor#ueditorclone或解压后目录如下安装node.js官方下载：https://nodejs.org/en/download/选择自己对应的版本安装，我选择的是win64 .msi，相同版本的小伙伴可以从网盘获取，官网下载速度实在感人网盘链接：https://pa
复制链接

扫一扫

专栏目录