From 3d03b73160a716d9c67ef9d076cbc39f86772a0d Mon Sep 17 00:00:00 2001 From: Okwukwe Ewurum Date: Mon, 4 Sep 2023 20:44:59 +0100 Subject: [PATCH] add an example usage with vuejs using quill-vue --- rvuejs/.gitignore | 25 +++++++++ rvuejs/README.md | 1 + rvuejs/index.html | 19 +++++++ rvuejs/package.json | 23 +++++++++ rvuejs/public/vite.svg | 1 + rvuejs/src/App.vue | 9 ++++ rvuejs/src/assets/vue.svg | 1 + rvuejs/src/components/TextEditor.vue | 65 +++++++++++++++++++++++ rvuejs/src/main.js | 10 ++++ rvuejs/vite.config.js | 7 +++ vuejs/.gitignore | 25 +++++++++ vuejs/index.html | 18 +++++++ vuejs/package.json | 23 +++++++++ vuejs/src/App.vue | 9 ++++ vuejs/src/components/TextEditor.vue | 77 ++++++++++++++++++++++++++++ vuejs/src/main.js | 10 ++++ vuejs/vite.config.js | 7 +++ 17 files changed, 330 insertions(+) create mode 100644 rvuejs/.gitignore create mode 100644 rvuejs/README.md create mode 100644 rvuejs/index.html create mode 100644 rvuejs/package.json create mode 100644 rvuejs/public/vite.svg create mode 100644 rvuejs/src/App.vue create mode 100644 rvuejs/src/assets/vue.svg create mode 100644 rvuejs/src/components/TextEditor.vue create mode 100644 rvuejs/src/main.js create mode 100644 rvuejs/vite.config.js create mode 100644 vuejs/.gitignore create mode 100644 vuejs/index.html create mode 100644 vuejs/package.json create mode 100644 vuejs/src/App.vue create mode 100644 vuejs/src/components/TextEditor.vue create mode 100644 vuejs/src/main.js create mode 100644 vuejs/vite.config.js diff --git a/rvuejs/.gitignore b/rvuejs/.gitignore new file mode 100644 index 0000000..c20018b --- /dev/null +++ b/rvuejs/.gitignore @@ -0,0 +1,25 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? +.vscode/ \ No newline at end of file diff --git a/rvuejs/README.md b/rvuejs/README.md new file mode 100644 index 0000000..b7a5ab2 --- /dev/null +++ b/rvuejs/README.md @@ -0,0 +1 @@ +# Vue 3 + Vite diff --git a/rvuejs/index.html b/rvuejs/index.html new file mode 100644 index 0000000..74dca91 --- /dev/null +++ b/rvuejs/index.html @@ -0,0 +1,19 @@ + + + + + + + Vite + Vue + + +
+ + + + + diff --git a/rvuejs/package.json b/rvuejs/package.json new file mode 100644 index 0000000..6383f7f --- /dev/null +++ b/rvuejs/package.json @@ -0,0 +1,23 @@ +{ + "name": "rvuejs", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite --port 4043", + "build": "vite build", + "preview": "vite preview" + }, + "dependencies": { + "@edtr-io/mathquill": "^0.11.0", + "@vueup/vue-quill": "^1.2.0", + "jquery": "^3.7.1", + "katex": "^0.16.8", + "mathquill4quill": "^2.4.0", + "vue": "^3.3.4" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^4.2.3", + "vite": "^4.4.5" + } +} diff --git a/rvuejs/public/vite.svg b/rvuejs/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/rvuejs/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/rvuejs/src/App.vue b/rvuejs/src/App.vue new file mode 100644 index 0000000..6a04bdd --- /dev/null +++ b/rvuejs/src/App.vue @@ -0,0 +1,9 @@ + + + diff --git a/rvuejs/src/assets/vue.svg b/rvuejs/src/assets/vue.svg new file mode 100644 index 0000000..770e9d3 --- /dev/null +++ b/rvuejs/src/assets/vue.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/rvuejs/src/components/TextEditor.vue b/rvuejs/src/components/TextEditor.vue new file mode 100644 index 0000000..6aec045 --- /dev/null +++ b/rvuejs/src/components/TextEditor.vue @@ -0,0 +1,65 @@ + + + diff --git a/rvuejs/src/main.js b/rvuejs/src/main.js new file mode 100644 index 0000000..1c6f0da --- /dev/null +++ b/rvuejs/src/main.js @@ -0,0 +1,10 @@ +import { createApp } from 'vue' +import 'katex/dist/katex.css'; +import '@vueup/vue-quill/dist/vue-quill.bubble.css'; +import '@vueup/vue-quill/dist/vue-quill.snow.css'; + +import 'mathquill4quill/mathquill4quill.css'; + +import App from './App.vue' + +createApp(App).mount('#app') diff --git a/rvuejs/vite.config.js b/rvuejs/vite.config.js new file mode 100644 index 0000000..05c1740 --- /dev/null +++ b/rvuejs/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import vue from '@vitejs/plugin-vue' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue()], +}) diff --git a/vuejs/.gitignore b/vuejs/.gitignore new file mode 100644 index 0000000..c20018b --- /dev/null +++ b/vuejs/.gitignore @@ -0,0 +1,25 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? +.vscode/ \ No newline at end of file diff --git a/vuejs/index.html b/vuejs/index.html new file mode 100644 index 0000000..d054069 --- /dev/null +++ b/vuejs/index.html @@ -0,0 +1,18 @@ + + + + + + + mathquill4quill demo (Vue 3) + + +
+ + + + diff --git a/vuejs/package.json b/vuejs/package.json new file mode 100644 index 0000000..ebb6ea5 --- /dev/null +++ b/vuejs/package.json @@ -0,0 +1,23 @@ +{ + "name": "rvuejs", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "start": "vite --port 4043", + "build": "vite build", + "preview": "vite preview" + }, + "dependencies": { + "@edtr-io/mathquill": "^0.11.0", + "@vueup/vue-quill": "^1.2.0", + "jquery": "^3.7.1", + "katex": "^0.16.8", + "mathquill4quill": "^2.4.0", + "vue": "^3.3.4" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^4.2.3", + "vite": "^4.4.5" + } +} diff --git a/vuejs/src/App.vue b/vuejs/src/App.vue new file mode 100644 index 0000000..4b0d872 --- /dev/null +++ b/vuejs/src/App.vue @@ -0,0 +1,9 @@ + + + diff --git a/vuejs/src/components/TextEditor.vue b/vuejs/src/components/TextEditor.vue new file mode 100644 index 0000000..410a531 --- /dev/null +++ b/vuejs/src/components/TextEditor.vue @@ -0,0 +1,77 @@ + + + + + diff --git a/vuejs/src/main.js b/vuejs/src/main.js new file mode 100644 index 0000000..1c6f0da --- /dev/null +++ b/vuejs/src/main.js @@ -0,0 +1,10 @@ +import { createApp } from 'vue' +import 'katex/dist/katex.css'; +import '@vueup/vue-quill/dist/vue-quill.bubble.css'; +import '@vueup/vue-quill/dist/vue-quill.snow.css'; + +import 'mathquill4quill/mathquill4quill.css'; + +import App from './App.vue' + +createApp(App).mount('#app') diff --git a/vuejs/vite.config.js b/vuejs/vite.config.js new file mode 100644 index 0000000..05c1740 --- /dev/null +++ b/vuejs/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import vue from '@vitejs/plugin-vue' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue()], +})