我想要 nuxt.js (vue.js) 中的 quilljs

Question

我知道 vue-quill-editor。

但是，我遇到了困难。

首先，我从

开始

vue vue-init nuxt / express myProject

和

npm install --save vue-quill-editor

~plugins/quill.js

import Vue from 'vue'

if (process.BROWSER_BUILD) {
  require('quill/dist/quill.snow.css')
  require('quill/dist/quill.bubble.css')
  require('quill/dist/quill.core.css')
  Vue.use(require('vue-quill-editor/ssr'))
}

nuxt.config.js

plugins: [
  { src: '~plugins/quill.js' }
]

这是正确的方法吗？

如何在此处添加模块？ 例如，

Import {ImageImport} from '../modules/ImageImport.js'
Import {ImageResize} from '../modules/ImageResize.js'
Quill.register ('modules / imageImport', ImageImport)
Quill.register ('modules / imageResize', ImageResize)

我可以参考以下，

但它似乎不是 nuxt.js 环境的示例。所以我失败了。

https://github.com/surmon-china/vue-quill-editor/tree/master/examples

感谢您的帮助。

Answer 1

你应该看看这个包：Vue Quill Editor。该软件包在here 中有NuxtJS 的示例。我已经成功了。

Answer 2

最好的做法是使用插件中的ssr: false 选项仅在客户端运行文件。

nuxt.config.js

module.exports = {
  plugins: [
    { src: '~plugins/quill.js', ssr: false }
  ],
}

查看 Nuxt 文档：https://nuxtjs.org/guide/plugins#client-side-only