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': ''
|
||||
},
|
||||
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"
|
||||
},
|
||||
"dependencies": {
|
||||
"@opentiny/fluent-editor": "workspace:~",
|
||||
"@opentiny/vue": "workspace:~",
|
||||
"@opentiny/vue-common": "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>
|
||||
<div id="editor">
|
||||
<p>Hello <strong>FluentEditor</strong>!</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
<script setup lang="ts">
|
||||
import { onMounted } from 'vue'
|
||||
import FluentEditor from '@opentiny/fluent-editor'
|
||||
|
||||
|
|
@ -33,3 +27,13 @@ onMounted(() => {
|
|||
})
|
||||
})
|
||||
</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