当前位置：网站首页>在vscode里面使用tinymce富文本编辑器

在vscode里面使用tinymce富文本编辑器

2022-07-20 02:11:00 【算法与编程之美】

问题

在vue里需要用到tinymace富文本编辑器，如何去进行安装。

​​方法

  1. 在浏览器中搜索tinymce，官方网站为英文网站

（官方网站地址：https://www.tiny.cloud/get-tiny/self-hosted/）

33f2e6ed6aeaff26c40104bace1cfa60.png

2.进入官网以后先点击上面的Docs选项，后选择最下面的Get TinyMCE Free

2bd0dd4439aeea6bffef83d7fa3f6f63.png

3.进入网页以后选择Download，跳转到最新版本页。但是我们为了更好的进行开发，我们则需要下载之前的版本，所以点击here跳转页面。

3257bb84e1096d6cdbb5e18e14046a2f.png

dc3d9af4ca1753a02871d38dab5be821.png

4.我们则需要点击页面的第4版本，右边的插件都可以选择下载，但是需要把最后Options内容取消掉，要不然以后将会把所有的文件打包到一个js文件夹里，然后点击Download.并将下载下来的压缩包解压到自己电脑的文件夹内。

a09ed8e9db4cdeabc1cc522249f3b977.png

b2e695b2e83fc5350f4ce3aec14afde0.png

5.打开vscode中的自己项目，单击右键将public在文件资源管理器中显示，打开public文件夹，将下载好的tinymce文件夹复制到里面去，则tinymce富文本编辑器则安装好。

c0e6c40241e1654f9defd46566340602.png

7a32eccb2b135b55d43bf4c629bf481f.png

0792c88b655bbdbf19463519cf49a05f.png

6.打开public文件夹，打开其中的index.html,在里面引入<script></script>标签，在标签的双引号中路径应该用上面的内容拼接上文件夹目录名，然后就可以直接使用了。

e6c27cecaae1fe3cf97f3601158656b9.png

9826e48317f9b3e0b3c9fa85367da1b7.png

8979068ab0ff78fb8be5ff8fa0cbbdbe.png

3结语

当在vscode里面创造vue文件时最好选择2.0版本，它可以向上兼容。

原网站

版权声明
本文为[算法与编程之美]所创，转载请带上原文链接，感谢
https://where2go.blog.csdn.net/article/details/125883986

边栏推荐

猜你喜欢

随机推荐