tiptap/demos/vite.config.ts

323 lines
8.8 KiB
TypeScript
Raw Normal View History

import { svelte } from '@sveltejs/vite-plugin-svelte'
import react from '@vitejs/plugin-react'
import vue from '@vitejs/plugin-vue'
import fg from 'fast-glob'
import fs from 'fs'
2021-08-25 17:52:20 +08:00
import {
basename,
dirname,
join,
resolve,
2021-08-25 17:52:20 +08:00
} from 'path'
import { v4 as uuid } from 'uuid'
import { defineConfig } from 'vite'
feat(pm): new prosemirror package for dependency resolving * chore:(core): migrate to tsup * chore: migrate blockquote and bold to tsup * chore: migrated bubble-menu and bullet-list to tsup * chore: migrated more packages to tsup * chore: migrate code and character extensions to tsup * chore: update package.json to simplify build for all packages * chore: move all packages to tsup as a build process * chore: change ci build task * feat(pm): add prosemirror meta package * rfix: resolve issues with build paths & export mappings * docs: update documentation to include notes for @tiptap/pm * chore(pm): update tsconfig * chore(packages): update packages * fix(pm): add package export infos & fix dependencies * chore(general): start moving to pm package as deps * chore: move to tiptap pm package internally * fix(demos): fix demos working with new pm package * fix(tables): fix tables package * fix(tables): fix tables package * chore(demos): pinned typescript version * chore: remove unnecessary tsconfig * chore: fix netlify build * fix(demos): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * chore(tests): fix tests not running correctly after pm package * chore(pm): add files to files array * chore: update build workflow * chore(tests): increase timeout time back to 12s * chore(docs): update docs * chore(docs): update installation guides & pm information to docs * chore(docs): add link to prosemirror docs * fix(vue-3): add missing build step * chore(docs): comment out cdn link * chore(docs): remove semicolons from docs * chore(docs): remove unnecessary installation note * chore(docs): remove unnecessary installation note
2023-02-03 00:37:33 +08:00
2021-09-18 05:44:01 +08:00
// import checker from 'vite-plugin-checker'
2021-08-25 17:52:20 +08:00
feat(pm): new prosemirror package for dependency resolving * chore:(core): migrate to tsup * chore: migrate blockquote and bold to tsup * chore: migrated bubble-menu and bullet-list to tsup * chore: migrated more packages to tsup * chore: migrate code and character extensions to tsup * chore: update package.json to simplify build for all packages * chore: move all packages to tsup as a build process * chore: change ci build task * feat(pm): add prosemirror meta package * rfix: resolve issues with build paths & export mappings * docs: update documentation to include notes for @tiptap/pm * chore(pm): update tsconfig * chore(packages): update packages * fix(pm): add package export infos & fix dependencies * chore(general): start moving to pm package as deps * chore: move to tiptap pm package internally * fix(demos): fix demos working with new pm package * fix(tables): fix tables package * fix(tables): fix tables package * chore(demos): pinned typescript version * chore: remove unnecessary tsconfig * chore: fix netlify build * fix(demos): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * chore(tests): fix tests not running correctly after pm package * chore(pm): add files to files array * chore: update build workflow * chore(tests): increase timeout time back to 12s * chore(docs): update docs * chore(docs): update installation guides & pm information to docs * chore(docs): add link to prosemirror docs * fix(vue-3): add missing build step * chore(docs): comment out cdn link * chore(docs): remove semicolons from docs * chore(docs): remove unnecessary installation note * chore(docs): remove unnecessary installation note
2023-02-03 00:37:33 +08:00
const getPackageDependencies = () => {
const paths: Array<{ find: string, replacement: any }> = []
2023-06-03 00:26:24 +08:00
paths.push({
find: 'yjs',
replacement: resolve('../node_modules/yjs/src/index.js'),
})
paths.push({
find: 'y-prosemirror',
replacement: resolve('./node_modules/y-prosemirror/src/y-prosemirror.js'),
})
2023-06-03 00:26:24 +08:00
feat(pm): new prosemirror package for dependency resolving * chore:(core): migrate to tsup * chore: migrate blockquote and bold to tsup * chore: migrated bubble-menu and bullet-list to tsup * chore: migrated more packages to tsup * chore: migrate code and character extensions to tsup * chore: update package.json to simplify build for all packages * chore: move all packages to tsup as a build process * chore: change ci build task * feat(pm): add prosemirror meta package * rfix: resolve issues with build paths & export mappings * docs: update documentation to include notes for @tiptap/pm * chore(pm): update tsconfig * chore(packages): update packages * fix(pm): add package export infos & fix dependencies * chore(general): start moving to pm package as deps * chore: move to tiptap pm package internally * fix(demos): fix demos working with new pm package * fix(tables): fix tables package * fix(tables): fix tables package * chore(demos): pinned typescript version * chore: remove unnecessary tsconfig * chore: fix netlify build * fix(demos): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * chore(tests): fix tests not running correctly after pm package * chore(pm): add files to files array * chore: update build workflow * chore(tests): increase timeout time back to 12s * chore(docs): update docs * chore(docs): update installation guides & pm information to docs * chore(docs): add link to prosemirror docs * fix(vue-3): add missing build step * chore(docs): comment out cdn link * chore(docs): remove semicolons from docs * chore(docs): remove unnecessary installation note * chore(docs): remove unnecessary installation note
2023-02-03 00:37:33 +08:00
fg.sync('../packages/*', { onlyDirectories: true })
.map(name => name.replace('../packages/', ''))
.forEach(name => {
if (name === 'pm') {
fg.sync(`../packages/${name}/*`, { onlyDirectories: true })
.forEach(subName => {
const subPkgName = subName.replace(`../packages/${name}/`, '')
paths.push({ find: `@tiptap/${name}/${subPkgName}`, replacement: resolve(`../packages/${name}/${subPkgName}/index.ts`) })
})
} else {
paths.push({ find: `@tiptap/${name}`, replacement: resolve(`../packages/${name}/src/index.ts`) })
}
})
return paths
}
const includeDependencies = fs.readFileSync('./includeDependencies.txt')
.toString()
.replace(/\r\n/g, '\n')
.split('\n')
.filter(value => value)
2021-08-25 17:52:20 +08:00
export default defineConfig({
server: {
port: 3000,
},
preview: {
port: 3000,
},
2021-08-26 22:23:19 +08:00
optimizeDeps: {
include: includeDependencies,
2021-08-26 22:23:19 +08:00
},
2021-08-25 17:52:20 +08:00
build: {
rollupOptions: {
2021-09-30 17:43:51 +08:00
input: fg.sync('./**/index.html', {
2021-08-25 17:52:20 +08:00
ignore: ['dist'],
}),
},
},
2024-07-15 20:05:47 +08:00
worker: {
format: 'es',
},
2021-08-25 17:52:20 +08:00
plugins: [
2021-09-18 05:44:01 +08:00
// checker({ typescript: { tsconfigPath: './tsconfig.base.json' } }),
// checker({ typescript: { tsconfigPath: './tsconfig.react.json' } }),
// checker({ typescript: { tsconfigPath: './tsconfig.vue-2.json' } }),
// checker({ typescript: { tsconfigPath: './tsconfig.vue-3.json' } }),
2024-06-27 23:37:27 +08:00
// @ts-ignore
2021-08-25 17:52:20 +08:00
vue(),
// @ts-ignore
react(),
// @ts-ignore
svelte(),
2021-08-25 17:52:20 +08:00
{
name: 'html-transform',
transformIndexHtml: {
enforce: 'pre',
transform(html: string, context) {
const dir = dirname(context.path)
const data = dir.split('/')
const demoCategory = data[2]
const demoName = data[3]
const frameworkName = data[4]
if (dir.endsWith('/JS') || dir.endsWith('-JS')) {
return {
html: `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
${html}
<script type="module">
import setup from '../../../../setup/js.ts'
import source from '@source'
setup('${demoCategory}/${demoName}/${frameworkName}', source)
</script>
</body>
</html>
`,
tags: [],
}
}
if (dir.endsWith('/Vue') || dir.endsWith('-Vue')) {
return {
html: `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div id="app"></div>
<script type="module">
import setup from '../../../../setup/vue.ts'
import source from '@source'
setup('${demoCategory}/${demoName}/${frameworkName}', source)
</script>
</body>
</html>
`,
tags: [],
}
}
if (dir.endsWith('/Svelte') || dir.endsWith('-Svelte')) {
return {
html: `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div id="app"></div>
<script type="module">
import setup from '../../../../setup/svelte.ts'
import source from '@source'
setup('${demoCategory}/${demoName}/${frameworkName}', source)
</script>
</body>
</html>
`,
tags: [],
}
}
if (dir.endsWith('/React') || dir.endsWith('-React')) {
return {
html: `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div id="app"></div>
<script type="module">
import setup from '../../../../setup/react.ts'
import source from '@source'
setup('${demoCategory}/${demoName}/${frameworkName}', source)
</script>
</body>
</html>
`,
tags: [],
}
}
},
},
},
2021-08-25 17:52:20 +08:00
{
name: 'raw',
resolveId(id, importer) {
2021-08-27 05:40:31 +08:00
if (id.startsWith('raw!') && importer) {
2021-08-25 17:52:20 +08:00
const [, relativePath] = id.split('raw!')
const fullPath = join(dirname(importer), relativePath)
return `virtual!${fullPath}!!${uuid()}`
}
},
load(id) {
if (id.startsWith('virtual!')) {
const path = id.split('!!')[0].replace('virtual!', '')
const data = fs.readFileSync(path, 'utf8')
return `export default ${JSON.stringify(data)}`
}
},
},
{
name: 'demos',
resolveId(id) {
if (id === '@demos') {
return '@demos'
}
},
load(id) {
if (id === '@demos') {
2021-09-30 17:43:51 +08:00
const demos = fg.sync('./src/*/*', { onlyDirectories: true })
2021-08-25 17:52:20 +08:00
.map(demoPath => {
const name = demoPath.replace('./src/', '')
2021-09-30 17:43:51 +08:00
const tabs = fg.sync(`./src/${name}/*`, { onlyDirectories: true })
2021-08-25 17:52:20 +08:00
.map(tabPath => ({
name: basename(tabPath),
}))
return {
name,
tabs,
}
})
return `export const demos = ${JSON.stringify(demos)}`
}
},
},
{
name: 'source',
resolveId(id, importer) {
2021-08-27 05:40:31 +08:00
if (id === '@source' && importer) {
2021-08-25 17:52:20 +08:00
return `source!${dirname(importer)}!!${uuid()}`
}
},
load(id) {
if (id.startsWith('source!')) {
const path = id.split('!!')[0].replace('source!', '')
const ignore = [
'**/*.spec.js',
'**/*.spec.ts',
]
if (!path.endsWith('/JS')) {
ignore.push('**/index.html')
}
const files = fg.sync(`${path}/**/*`, { ignore })
2021-08-25 17:52:20 +08:00
.map(filePath => {
const name = filePath.replace(`${path}/`, '')
return {
name,
content: fs.readFileSync(`${path}/${name}`, 'utf8'),
}
})
2021-08-27 05:28:52 +08:00
.sort((a, b) => {
const depthA = a.name.split('/').length
const depthB = b.name.split('/').length
2021-08-25 17:52:20 +08:00
2021-08-27 05:28:52 +08:00
if (depthA > depthB) {
return 1
}
2021-08-27 05:03:31 +08:00
2021-08-27 05:28:52 +08:00
if (depthA < depthB) {
return -1
}
const aIsIndex = basename(a.name).includes('index.')
const bIsIndex = basename(b.name).includes('index.')
if (aIsIndex) {
return -1
}
if (bIsIndex) {
return 1
}
return 0
})
2021-08-27 05:03:31 +08:00
2021-08-27 05:28:52 +08:00
return `export default ${JSON.stringify(files)}`
2021-08-25 17:52:20 +08:00
}
},
},
{
name: 'middleware',
apply: 'serve',
configureServer(viteDevServer) {
return () => {
viteDevServer.middlewares.use(async (req, res, next) => {
2021-08-27 05:40:31 +08:00
if (req?.originalUrl?.startsWith('/preview')) {
2021-08-25 17:52:20 +08:00
req.url = '/preview/index.html'
}
next()
})
}
},
},
],
resolve: {
feat(pm): new prosemirror package for dependency resolving * chore:(core): migrate to tsup * chore: migrate blockquote and bold to tsup * chore: migrated bubble-menu and bullet-list to tsup * chore: migrated more packages to tsup * chore: migrate code and character extensions to tsup * chore: update package.json to simplify build for all packages * chore: move all packages to tsup as a build process * chore: change ci build task * feat(pm): add prosemirror meta package * rfix: resolve issues with build paths & export mappings * docs: update documentation to include notes for @tiptap/pm * chore(pm): update tsconfig * chore(packages): update packages * fix(pm): add package export infos & fix dependencies * chore(general): start moving to pm package as deps * chore: move to tiptap pm package internally * fix(demos): fix demos working with new pm package * fix(tables): fix tables package * fix(tables): fix tables package * chore(demos): pinned typescript version * chore: remove unnecessary tsconfig * chore: fix netlify build * fix(demos): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * fix(tests): fix package resolving for pm packages * chore(tests): fix tests not running correctly after pm package * chore(pm): add files to files array * chore: update build workflow * chore(tests): increase timeout time back to 12s * chore(docs): update docs * chore(docs): update installation guides & pm information to docs * chore(docs): add link to prosemirror docs * fix(vue-3): add missing build step * chore(docs): comment out cdn link * chore(docs): remove semicolons from docs * chore(docs): remove unnecessary installation note * chore(docs): remove unnecessary installation note
2023-02-03 00:37:33 +08:00
alias: getPackageDependencies(),
2021-08-25 17:52:20 +08:00
},
})