官网

vue-quill-editor

Toolbar Module - Quill

vue-quill-image-upload

图片支持上传服务器并调整大小

1.在 package.json 中加入 "quill-image-extend-module": "^1.1.2" 依赖

2.在编辑器组件中引入以下代码

    复制代码

集成quill-image-extend-module后打包抱错：

原因是因为 uglifyjs 不支持ES6 (ES2015), 所以你需要在webpack uglify 之前, 把报错的文件（或文件夹）用babel-loader 处理

vue webpack template 有个 build/webpack.base.conf.js 文件

var path = require('path')var utils = require('./utils')...module.exports = {...  module: {    ...      {        test: /\.js$/,        loader: 'babel-loader',        include: [          resolve('src'),          resolve('test')        ]      },复制代码

这段代表的就是用 babel-loader 把 这些 include 的所有文件（和文件夹里任何文件), 用babel-loader 处理, 你会发现你的src 也在这个 include 列组里 (很容易理解，因为写Vue, 就基本会用到 ES6 syntax)

只需要吧这个插件的路径加到下面就行（如下）：

基本上任何与javascript syntax 有关的问题 (build 会报错是哪个文件, 而且一般都是在uglify 环节), 都可以放到这里。指定先用babel-loader 转换成最基础的javascript 格式， 这样一般后续环节都不会有javascript syntax 问题 (因为最基础的javascript 格式总该都要支持吧)。