forked from opentiny/tiny-vue
docs(fluent-editor): add fluent-editor docs (#1834)
This commit is contained in:
GitHub
parent
1e455318a4
commit
5a6b45a83f
|
|
@ -1,40 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="editor">
|
|
||||||
<p>Hello <strong>FluentEditor</strong>!</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import FluentEditor from '@opentiny/fluent-editor'
|
|
||||||
|
|
||||||
const TOOLBAR_CONFIG = [
|
|
||||||
['undo', 'redo', 'clean'],
|
|
||||||
['bold', 'italic', 'underline', 'strike'],
|
|
||||||
[{ header: [] }],
|
|
||||||
[{ font: [] }, { size: [] }],
|
|
||||||
[{ color: [] }, { background: [] }],
|
|
||||||
[{ align: [] }, { list: 'bullet' }, { list: 'ordered' }, { list: 'check' }],
|
|
||||||
['code', 'code-block', 'blockquote'],
|
|
||||||
['image', 'file', 'better-table', 'link', 'global-link'],
|
|
||||||
['fullscreen', 'emoji', 'help', 'screenshot'],
|
|
||||||
]
|
|
||||||
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
content: '{"ops":[{"insert":"Hello "},{"attributes":{"bold":true},"insert":"FluentEditor"},{"insert":"!"}]}',
|
|
||||||
editor: null,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.editor = new FluentEditor('#editor', {
|
|
||||||
theme: 'snow',
|
|
||||||
modules: {
|
|
||||||
toolbar: {
|
|
||||||
container: TOOLBAR_CONFIG
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
@ -64,19 +64,6 @@ export default {
|
||||||
'en-US': ''
|
'en-US': ''
|
||||||
},
|
},
|
||||||
codeFiles: ['data-switch.vue']
|
codeFiles: ['data-switch.vue']
|
||||||
},
|
}
|
||||||
// {
|
|
||||||
// demoId: 'fluent-editor',
|
|
||||||
// name: {
|
|
||||||
// 'zh-CN': '框架无关版本',
|
|
||||||
// 'en-US': ''
|
|
||||||
// },
|
|
||||||
// desc: {
|
|
||||||
// 'zh-CN': '<p>通过 <code>new FluentEditor(\'#editor\', options)</code> 初始化一个富文本编辑器，用法和 Quill 一样，第一个参数是需要挂载富文本编辑器的 DOM 节点，第二个参数是配置项。</p>',
|
|
||||||
// 'en-US':
|
|
||||||
// '<p></p>'
|
|
||||||
// },
|
|
||||||
// codeFiles: ['fluent-editor.vue']
|
|
||||||
// }
|
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,6 @@
|
||||||
"pub": "pnpm publish --no-git-checks --access=public"
|
"pub": "pnpm publish --no-git-checks --access=public"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@opentiny/fluent-editor": "workspace:~",
|
|
||||||
"@opentiny/vue": "workspace:~",
|
"@opentiny/vue": "workspace:~",
|
||||||
"@opentiny/vue-common": "workspace:~",
|
"@opentiny/vue-common": "workspace:~",
|
||||||
"@opentiny/vue-design-aurora": "workspace:~",
|
"@opentiny/vue-design-aurora": "workspace:~",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>FluentEditor</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.ts"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
{
|
||||||
|
"name": "fluent-editor-docs",
|
||||||
|
"private": true,
|
||||||
|
"version": "0.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vue-tsc && vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@opentiny/fluent-editor": "workspace:^",
|
||||||
|
"vue": "^3.3.11"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@vitejs/plugin-vue": "^4.5.2",
|
||||||
|
"typescript": "^5.2.2",
|
||||||
|
"vite": "^5.0.8",
|
||||||
|
"vue-tsc": "^1.8.25"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import BasicUsage from './components/BasicUsage.vue'
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BasicUsage />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
</style>
|
||||||
|
|
@ -1,10 +1,4 @@
|
||||||
<template>
|
<script setup lang="ts">
|
||||||
<div id="editor">
|
|
||||||
<p>Hello <strong>FluentEditor</strong>!</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { onMounted } from 'vue'
|
import { onMounted } from 'vue'
|
||||||
import FluentEditor from '@opentiny/fluent-editor'
|
import FluentEditor from '@opentiny/fluent-editor'
|
||||||
|
|
||||||
|
|
@ -33,3 +27,13 @@ onMounted(() => {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div id="editor">
|
||||||
|
<p>Hello <strong>FluentEditor</strong>!</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,5 @@
|
||||||
|
import { createApp } from 'vue'
|
||||||
|
import './style.css'
|
||||||
|
import App from './App.vue'
|
||||||
|
|
||||||
|
createApp(App).mount('#app')
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
@import '@opentiny/fluent-editor/dist/style.css'
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
/// <reference types="vite/client" />
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "ES2020",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
/* Bundler mode */
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowImportingTsExtensions": true,
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"noEmit": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
|
||||||
|
/* Linting */
|
||||||
|
"strict": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"noFallthroughCasesInSwitch": true
|
||||||
|
},
|
||||||
|
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||||
|
"references": [{ "path": "./tsconfig.node.json" }]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowSyntheticDefaultImports": true
|
||||||
|
},
|
||||||
|
"include": ["vite.config.ts"]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import vue from '@vitejs/plugin-vue'
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [vue()],
|
||||||
|
})
|
||||||
Loading…
Reference in New Issue