elmgates/DailyHot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ feat: 支持配置站点目录 #18

Browse Source
This commit is contained in:
imsyy
2023-12-26 16:17:41 +08:00
parent feeb257c9c
commit 90b9388386
3 changed files with 131 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.env
View File

@@ -4,3 +4,6 @@ VITE_GLOBAL_API="https://api-hot.imsyy.top"
# ICP 备案号
VITE_ICP = "豫ICP备2022018134号-1"
# 全局目录
VITE_DIR = "/"

89
src/components/HotList.vue
View File

@@ -25,7 +25,7 @@
</template>
<n-scrollbar class="news-list" ref="scrollbarRef">
<Transition name="fade" mode="out-in">
<template v-if="loadingError">
<div v-if="loadingError" class="error">
<n-result
size="small"
status="500"
@@ -33,43 +33,51 @@
description="生活总会遇到不如意的事情"
style="margin-top: 40px"
/>
</template>
<template v-else-if="!hotListData || listLoading">
<div class="loading">
<n-skeleton text round :repeat="10" height="20px" />
</div>
</template>
<template v-else>
<div class="lists" :id="hotData.name + 'Lists'">
<div
class="item"
v-for="(item, index) in hotListData.data.slice(0, 15)"
:key="item"
<n-button
size="small"
secondary
strong
round
@click.stop="getHotListsData(hotData.name)"
>
<template #icon>
<n-icon :component="Refresh" />
</template>
重试
</n-button>
</div>
<div v-else-if="!hotListData || listLoading" class="loading">
<n-skeleton text round :repeat="10" height="20px" />
</div>
<div v-else class="lists" :id="hotData.name + 'Lists'">
<div
class="item"
v-for="(item, index) in hotListData.data.slice(0, 15)"
:key="item"
>
<n-text
class="num"
:class="
index === 0
? 'one'
: index === 1
? 'two'
: index === 2
? 'three'
: null
"
:depth="2"
>{{ index + 1 }}</n-text
>
<n-text
class="num"
:class="
index === 0
? 'one'
: index === 1
? 'two'
: index === 2
? 'three'
: null
"
:depth="2"
>{{ index + 1 }}</n-text
>
<n-text
:style="{ fontSize: store.listFontSize + 'px' }"
class="text"
@click.stop="jumpLink(item)"
>
{{ item.title }}
</n-text>
</div>
<n-text
:style="{ fontSize: store.listFontSize + 'px' }"
class="text"
@click.stop="jumpLink(item)"
>
{{ item.title }}
</n-text>
</div>
</template>
</div>
</Transition>
</n-scrollbar>
<template #footer>
@@ -294,6 +302,15 @@ onMounted(() => {
right: 0;
}
.error {
display: flex;
flex-direction: column;
align-items: center;
.n-button {
margin-top: 12px;
}
}
.loading {
display: flex;
flex-direction: column;

145
vite.config.js
View File

@@ -1,82 +1,85 @@
import { fileURLToPath, URL } from "node:url";
import { defineConfig } from "vite";
import { defineConfig, loadEnv } from "vite";
import { NaiveUiResolver } from "unplugin-vue-components/resolvers";
import { VitePWA } from "vite-plugin-pwa";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { NaiveUiResolver } from "unplugin-vue-components/resolvers";
import { VitePWA } from "vite-plugin-pwa";
export default defineConfig({
plugins: [
vue(),
AutoImport({
imports: [
"vue",
{
"naive-ui": [
"useDialog",
"useMessage",
"useNotification",
"useLoadingBar",
export default defineConfig(({ mode }) => {
return {
base: loadEnv(mode, process.cwd())["VITE_DIR"],
plugins: [
vue(),
AutoImport({
imports: [
"vue",
{
"naive-ui": [
"useDialog",
"useMessage",
"useNotification",
"useLoadingBar",
],
},
],
}),
Components({
resolvers: [NaiveUiResolver()],
}),
// PWA
VitePWA({
registerType: "autoUpdate",
workbox: {
cleanupOutdatedCaches: true,
runtimeCaching: [
{
urlPattern: /(.*?)\.(woff2|woff|ttf)/,
handler: "CacheFirst",
options: {
cacheName: "file-cache",
},
},
{
urlPattern:
/(.*?)\.(webp|png|jpe?g|svg|gif|bmp|psd|tiff|tga|eps)/,
handler: "CacheFirst",
options: {
cacheName: "image-cache",
},
},
],
},
],
}),
Components({
resolvers: [NaiveUiResolver()],
}),
// PWA
VitePWA({
registerType: "autoUpdate",
workbox: {
cleanupOutdatedCaches: true,
runtimeCaching: [
{
urlPattern: /(.*?)\.(woff2|woff|ttf)/,
handler: "CacheFirst",
options: {
cacheName: "file-cache",
manifest: {
name: "今日热榜",
short_name: "DailyHot",
description: "汇聚全网热点，热门尽览无余",
display: "standalone",
start_url: "/",
theme_color: "#fff",
background_color: "#efefef",
icons: [
{
src: "/ico/favicon.png",
sizes: "200x200",
type: "image/png",
},
},
{
urlPattern: /(.*?)\.(webp|png|jpe?g|svg|gif|bmp|psd|tiff|tga|eps)/,
handler: "CacheFirst",
options: {
cacheName: "image-cache",
},
},
],
},
manifest: {
name: "今日热榜",
short_name: "DailyHot",
description: "汇聚全网热点，热门尽览无余",
display: "standalone",
start_url: "/",
theme_color: "#fff",
background_color: "#efefef",
icons: [
{
src: "/ico/favicon.png",
sizes: "200x200",
type: "image/png",
},
],
},
}),
],
resolve: {
alias: {
"@": fileURLToPath(new URL("./src", import.meta.url)),
},
},
build: {
minify: "terser",
terserOptions: {
compress: {
pure_funcs: ["console.log"],
],
},
}),
],
resolve: {
alias: {
"@": fileURLToPath(new URL("./src", import.meta.url)),
},
},
},
build: {
minify: "terser",
terserOptions: {
compress: {
pure_funcs: ["console.log"],
},
},
},
};
});