vue2.0项目中使用百度Ueditor富文本编辑器

1.首先下载静态文件

https://ueditor.baidu.com/website/download.html

2.然后，进行配置

首先把官网下载的Ueditor资源，放入静态资源src/static中。

修改ueditor.config.js中的window.UEDITOR_HOME_URL配置，如下图：

 

3.在main.js中引入

import '../static/utf8-jsp/ueditor.config.js'
import '../static/utf8-jsp/ueditor.all.min.js'
import '../static/utf8-jsp/lang/zh-cn/zh-cn.js'
import '../static/utf8-jsp/ueditor.parse.min.js'

4.开发公共组件

开发公共组件，可设置填充内容defaultMsg，配置信息config(宽度和高度等)，并提供获取内容的方法。

5.使用

当我们需要使用富文本编辑器时，直接调用公共组件即可

如果有严格模式报错

Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them...

这个问题是因为项目中的使用的babel默认添加了use strict造成，可参考 https://segmentfault.com/q/1010000007415253
我采用的是链接中答案的第三种方式：添加了babel-plugin-transform-remove-strict-mode，并在.babelrc里添加下列代码

{
  "plugins": ["transform-remove-strict-mode"]
}

注：ES6的模块自动采用严格模式，不管你有没有在模块头部加上"use strict";

效果图如下：