首先看下报错
Cannot read property 'imports' of undefined"、
Failed to mount component: template or render function not defined.、
Cannot read property 'register' of undefined
正确引入过程
1.安装依赖
cnpm install quill-image-resize-module
2.在项目build文件夹中找到webpack.base.conf.js
如果找不到webpack.base.conf.js文件，可以看看webpack开头的文件中有哪个模块写的是
module.exports = {
entry:{},
output:{},
resolve:{},
module:{}
}
因为要在module中加入以下内容，所以要找到这个webpack文件
3.在webpack文件module模块中加入下面代码
module.exports = {
entry:{},
output:{},
resolve:{},
module:{
rules:[
{
test: /\.js$/,
exclude: /node_modules(?!\/quill-image-drop-module|quill-image-resize-module)/,
loader: 'babel-loader'
}
]}
plugins: [
new webpack.ProvidePlugin({
'window.Quill': 'quill/dist/quill.js',
'Quill': 'quill/dist/quill.js'
})
]
}
4.在项目中引入
import Quill from 'quill'
import imageResize from 'quill-image-drop-module'
Quill.register('modules/imageResize', imageResize)
5.然后再富文本配置项中配置可缩放组件
options:{
modules:{
toolbar:[], // 配置富文本显示哪些按钮的
imageResize:{} // 配置图片可缩放大小
}
}
这样项目就不会报错啦
