refactor: redesign module system

This commit is contained in:
Anthony Fu 2021-01-22 18:05:58 +08:00
parent 7ba2102b96
commit 4c51428587
8 changed files with 29 additions and 20 deletions

View File

@ -1,22 +1,14 @@
import './styles/main.postcss'
// import routes generated by Voie
import routes from 'vite-plugin-pages/client'
// progress bar
import NProgress from 'nprogress'
import { ViteSSG } from 'vite-ssg'
import installPlugins from './plugins'
import App from './App.vue'
// https://github.com/antfu/vite-ssg
export const createApp = ViteSSG(
App,
{ routes },
({ app, router, isClient }) => {
installPlugins(app)
if (isClient) {
router.beforeEach(() => { NProgress.start() })
router.afterEach(() => { NProgress.done() })
}
(ctx) => {
// install all modules under `modules/`
Object.values(import.meta.globEager('./modules/*.ts')).map(i => i.install?.(ctx))
},
)

11
src/modules/README.md Normal file
View File

@ -0,0 +1,11 @@
## Modules
A custom user module system. Place a `.ts` file with the following template, it will be installed automatically.
```ts
import { UserModule } from '/~/types'
export const install: UserModule = ({ app, router, isClient }) => {
// do something
}
```

View File

@ -1,5 +1,5 @@
import { App } from 'vue'
import { createI18n } from 'vue-i18n'
import { UserModule } from '/~/types'
// import i18n resources
// https://vitejs.dev/guide/features.html#glob-import
@ -11,7 +11,7 @@ const messages = Object.fromEntries(
}),
)
export default (app: App) => {
export const install: UserModule = ({ app }) => {
const i18n = createI18n({
legacy: false,
locale: 'en',

9
src/modules/nprogress.ts Normal file
View File

@ -0,0 +1,9 @@
import NProgress from 'nprogress'
import { UserModule } from '/~/types'
export const install: UserModule = ({ isClient, router }) => {
if (isClient) {
router.beforeEach(() => { NProgress.start() })
router.afterEach(() => { NProgress.done() })
}
}

View File

@ -5,7 +5,7 @@ Check out [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) f
### Path Aliasing
You can use `/~/` aliasing to `./src/` folder.
`/~/` is aliased to `./src/` folder.
For example, instead of having

View File

@ -1,6 +0,0 @@
import { App } from 'vue'
import installI18n from './i18n'
export default (app: App) => {
installI18n(app)
}

3
src/types.ts Normal file
View File

@ -0,0 +1,3 @@
import { ViteSSGContext } from 'vite-ssg'
export type UserModule = (ctx: ViteSSGContext) => void