refactor: use ~/ for alias and improve ssg

This commit is contained in:
Anthony Fu 2021-02-05 09:34:09 +08:00
parent 7074ca3704
commit 1799f56844
10 changed files with 30 additions and 12 deletions

View File

@ -7,8 +7,6 @@
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#00aba9">
<meta name="msapplication-TileColor" content="#00aba9">
<meta name="theme-color" content="#ffffff">
<meta name="description" content="Opinionated Vite Starter Template">
<title>Vitesse</title>
</head>
<body>
<div id="app"></div>

View File

@ -2,7 +2,7 @@
"private": true,
"scripts": {
"dev": "vite --port 3333 --open",
"build": "cross-env NODE_ENV=production vite-ssg build --script async"
"build": "cross-env NODE_ENV=production vite-ssg build"
},
"dependencies": {
"@vueuse/core": "^4.0.12",

View File

@ -1,3 +1,17 @@
<script setup lang="ts">
import { useHead } from '@vueuse/head'
// https://github.com/vueuse/head
// you can use this to manipulate the document head in any components,
// they will be renedered correctly in the html results with vite-ssg
useHead({
title: 'Vitesse',
meta: [
{ name: 'description', content: 'Opinionated Vite Starter Template' },
],
})
</script>
<template>
<main class="px-4 py-10 text-center text-gray-700 dark:text-gray-200">
<router-view />

View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import { isDark } from '/~/logics'
import { isDark } from '~/logics'
const { t, availableLocales, locale } = useI18n()

View File

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

View File

@ -1,5 +1,5 @@
import { createI18n } from 'vue-i18n'
import { UserModule } from '/~/types'
import { UserModule } from '~/types'
// import i18n resources
// https://vitejs.dev/guide/features.html#glob-import

View File

@ -1,5 +1,5 @@
import NProgress from 'nprogress'
import { UserModule } from '/~/types'
import { UserModule } from '~/types'
export const install: UserModule = ({ isClient, router }) => {
if (isClient) {

View File

@ -5,7 +5,7 @@ Check out [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) f
### Path Aliasing
`/~/` is aliased to `./src/` folder.
`~/` is aliased to `./src/` folder.
For example, instead of having
@ -16,5 +16,5 @@ import { isDark } from '../../../../logics'
now you can use
```ts
import { isDark } from '/~/logics'
import { isDark } from '~/logics'
```

View File

@ -15,7 +15,7 @@
"forceConsistentCasingInFileNames": true,
"types": ["vite/client"],
"paths": {
"/~/*": ["src/*"]
"~/*": ["src/*"]
}
},
"exclude": ["dist", "node_modules"]

View File

@ -5,13 +5,13 @@ import Pages from 'vite-plugin-pages'
import ViteIcons, { ViteIconsResolver } from 'vite-plugin-icons'
import ViteComponents from 'vite-plugin-components'
import Markdown from 'vite-plugin-md'
import VitePWA from 'vite-plugin-pwa'
import { VitePWA } from 'vite-plugin-pwa'
import VueI18n from '@intlify/vite-plugin-vue-i18n'
import Prism from 'markdown-it-prism'
export default defineConfig({
alias: {
'/~/': `${path.resolve(__dirname, 'src')}/`,
'~/': `${path.resolve(__dirname, 'src')}/`,
},
plugins: [
Vue({
@ -56,6 +56,7 @@ export default defineConfig({
// https://github.com/antfu/vite-plugin-pwa
VitePWA({
inlineRegister: false,
manifest: {
name: 'Vitesse',
short_name: 'Vitesse',
@ -80,4 +81,9 @@ export default defineConfig({
include: [path.resolve(__dirname, 'locales/**')],
}),
],
// https://github.com/antfu/vite-ssg
ssgOptions: {
script: 'async',
formatting: 'minify',
},
})