build: add Vite web production pipeline
This commit is contained in:
1
.gitignore
vendored
1
.gitignore
vendored
@@ -1,5 +1,6 @@
|
|||||||
# 依赖
|
# 依赖
|
||||||
node_modules/
|
node_modules/
|
||||||
|
frontend/dist/
|
||||||
__pycache__/
|
__pycache__/
|
||||||
*.pyc
|
*.pyc
|
||||||
*.pyo
|
*.pyo
|
||||||
|
|||||||
@@ -45,9 +45,7 @@
|
|||||||
</script>
|
</script>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>玩玩云 - 文件管理平台</title>
|
<title>玩玩云 - 文件管理平台</title>
|
||||||
<script src="libs/vue.global.prod.js"></script>
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<script src="libs/axios.min.js"></script>
|
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
|
||||||
<style>
|
<style>
|
||||||
/* ========== 暗色主题 CSS 变量(默认) ========== */
|
/* ========== 暗色主题 CSS 变量(默认) ========== */
|
||||||
:root {
|
:root {
|
||||||
@@ -7671,7 +7669,7 @@
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<link rel="stylesheet" href="workspace.css?v=20260721006">
|
<link rel="stylesheet" href="workspace.css">
|
||||||
<script src="app.js?v=20260721006"></script>
|
<script type="module" src="app.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,4 +1,6 @@
|
|||||||
const { createApp } = Vue;
|
import axios from 'axios';
|
||||||
|
import { createApp } from 'vue';
|
||||||
|
|
||||||
const DEFAULT_LOCAL_STORAGE_QUOTA_BYTES = 1024 * 1024 * 1024; // 1GB
|
const DEFAULT_LOCAL_STORAGE_QUOTA_BYTES = 1024 * 1024 * 1024; // 1GB
|
||||||
const DEFAULT_OSS_STORAGE_QUOTA_BYTES = 1024 * 1024 * 1024; // 1GB
|
const DEFAULT_OSS_STORAGE_QUOTA_BYTES = 1024 * 1024 * 1024; // 1GB
|
||||||
|
|
||||||
|
|||||||
@@ -15,8 +15,8 @@
|
|||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<link rel="stylesheet" href="landing.css?v=20260212008">
|
<link rel="stylesheet" href="landing.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="page">
|
<div class="page">
|
||||||
|
|||||||
1410
frontend/package-lock.json
generated
Normal file
1410
frontend/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
21
frontend/package.json
Normal file
21
frontend/package.json
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
{
|
||||||
|
"name": "wanwanyun-frontend",
|
||||||
|
"version": "3.1.1",
|
||||||
|
"private": true,
|
||||||
|
"type": "module",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=20.19 <25"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite --host 0.0.0.0",
|
||||||
|
"build": "vite build && node scripts/copy-runtime-assets.js && node scripts/verify-build.js",
|
||||||
|
"preview": "vite preview --host 0.0.0.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"axios": "1.18.1",
|
||||||
|
"vue": "3.5.40"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"vite": "8.1.5"
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -4,8 +4,8 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>产品能力 - 玩玩云</title>
|
<title>产品能力 - 玩玩云</title>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<link rel="stylesheet" href="landing.css?v=20260212008">
|
<link rel="stylesheet" href="landing.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="page">
|
<div class="page">
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>重置密码 - 玩玩云</title>
|
<title>重置密码 - 玩玩云</title>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<style>
|
<style>
|
||||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
|
||||||
|
|||||||
@@ -4,8 +4,8 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>应用场景 - 玩玩云</title>
|
<title>应用场景 - 玩玩云</title>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<link rel="stylesheet" href="landing.css?v=20260212008">
|
<link rel="stylesheet" href="landing.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="page">
|
<div class="page">
|
||||||
|
|||||||
34
frontend/scripts/copy-runtime-assets.js
Normal file
34
frontend/scripts/copy-runtime-assets.js
Normal file
@@ -0,0 +1,34 @@
|
|||||||
|
import { copyFileSync, existsSync, mkdirSync, readdirSync } from 'node:fs';
|
||||||
|
import path from 'node:path';
|
||||||
|
import { fileURLToPath } from 'node:url';
|
||||||
|
|
||||||
|
const frontendRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
|
||||||
|
const outputDirectory = path.join(frontendRoot, 'dist');
|
||||||
|
|
||||||
|
mkdirSync(outputDirectory, { recursive: true });
|
||||||
|
|
||||||
|
function copyEntry(source, destination) {
|
||||||
|
const entries = readdirSync(source, { withFileTypes: true });
|
||||||
|
mkdirSync(destination, { recursive: true });
|
||||||
|
for (const entry of entries) {
|
||||||
|
const sourcePath = path.join(source, entry.name);
|
||||||
|
const destinationPath = path.join(destination, entry.name);
|
||||||
|
if (entry.isDirectory()) {
|
||||||
|
copyEntry(sourcePath, destinationPath);
|
||||||
|
} else if (entry.isFile()) {
|
||||||
|
copyFileSync(sourcePath, destinationPath);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const entry of ['libs', 'favicon.ico']) {
|
||||||
|
const source = path.join(frontendRoot, entry);
|
||||||
|
if (existsSync(source)) {
|
||||||
|
const destination = path.join(outputDirectory, entry);
|
||||||
|
if (entry.includes('.')) {
|
||||||
|
copyFileSync(source, destination);
|
||||||
|
} else {
|
||||||
|
copyEntry(source, destination);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
35
frontend/scripts/verify-build.js
Normal file
35
frontend/scripts/verify-build.js
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
import assert from 'node:assert/strict';
|
||||||
|
import { existsSync, readFileSync, readdirSync } from 'node:fs';
|
||||||
|
import path from 'node:path';
|
||||||
|
import { fileURLToPath } from 'node:url';
|
||||||
|
|
||||||
|
const frontendRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
|
||||||
|
const outputDirectory = path.join(frontendRoot, 'dist');
|
||||||
|
const htmlFiles = readdirSync(frontendRoot).filter((fileName) => fileName.endsWith('.html'));
|
||||||
|
|
||||||
|
assert.ok(existsSync(path.join(outputDirectory, 'index.html')), 'dist/index.html is missing');
|
||||||
|
assert.ok(existsSync(path.join(outputDirectory, 'favicon.ico')), 'dist/favicon.ico is missing');
|
||||||
|
assert.strictEqual(existsSync(path.join(outputDirectory, 'downloads')), false, 'runtime installers must stay outside dist');
|
||||||
|
|
||||||
|
for (const fileName of htmlFiles) {
|
||||||
|
const sourceHtml = readFileSync(path.join(frontendRoot, fileName), 'utf8');
|
||||||
|
const builtHtmlPath = path.join(outputDirectory, fileName);
|
||||||
|
assert.strictEqual(/\?v=\d+/.test(sourceHtml), false, `${fileName} still uses a manual cache version`);
|
||||||
|
assert.ok(existsSync(builtHtmlPath), `${fileName} was not emitted`);
|
||||||
|
|
||||||
|
const builtHtml = readFileSync(builtHtmlPath, 'utf8');
|
||||||
|
const assetUrls = [...builtHtml.matchAll(/(?:src|href)="(\/(?:assets|libs)\/[^"?#]+)"/g)]
|
||||||
|
.map((match) => match[1]);
|
||||||
|
for (const assetUrl of assetUrls) {
|
||||||
|
const assetPath = path.join(outputDirectory, ...assetUrl.split('/').filter(Boolean));
|
||||||
|
assert.ok(existsSync(assetPath), `${fileName} references missing asset ${assetUrl}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const fileName of ['app.html', 'share.html']) {
|
||||||
|
const html = readFileSync(path.join(outputDirectory, fileName), 'utf8');
|
||||||
|
assert.ok(/\/assets\/[^"']+\.js/.test(html), `${fileName} is not using a bundled module`);
|
||||||
|
assert.strictEqual(/vue\.global(?:\.prod)?\.js|axios\.min\.js/.test(html), false, `${fileName} still loads global Vue/Axios`);
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(`Verified ${htmlFiles.length} HTML entries and their emitted assets.`);
|
||||||
@@ -4,9 +4,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>文件分享 - 玩玩云</title>
|
<title>文件分享 - 玩玩云</title>
|
||||||
<script src="/libs/vue.global.prod.js"></script>
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<script src="/libs/axios.min.js"></script>
|
|
||||||
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css">
|
|
||||||
<style>
|
<style>
|
||||||
/* 防止 Vue 初始化前显示原始模板 */
|
/* 防止 Vue 初始化前显示原始模板 */
|
||||||
[v-cloak] { display: none !important; }
|
[v-cloak] { display: none !important; }
|
||||||
@@ -1121,8 +1119,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script type="module">
|
||||||
const { createApp } = Vue;
|
import axios from 'axios';
|
||||||
|
import { createApp } from 'vue';
|
||||||
|
|
||||||
createApp({
|
createApp({
|
||||||
data() {
|
data() {
|
||||||
|
|||||||
@@ -4,8 +4,8 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>快速开始 - 玩玩云</title>
|
<title>快速开始 - 玩玩云</title>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<link rel="stylesheet" href="landing.css?v=20260212008">
|
<link rel="stylesheet" href="landing.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="page">
|
<div class="page">
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>邮箱验证 - 玩玩云</title>
|
<title>邮箱验证 - 玩玩云</title>
|
||||||
<link rel="stylesheet" href="libs/fontawesome/css/all.min.css">
|
<link rel="stylesheet" href="/libs/fontawesome/css/all.min.css" vite-ignore>
|
||||||
<style>
|
<style>
|
||||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
|
||||||
|
|||||||
42
frontend/vite.config.js
Normal file
42
frontend/vite.config.js
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
import { readdirSync } from 'node:fs';
|
||||||
|
import path from 'node:path';
|
||||||
|
import { fileURLToPath } from 'node:url';
|
||||||
|
|
||||||
|
import { defineConfig } from 'vite';
|
||||||
|
|
||||||
|
const frontendRoot = path.dirname(fileURLToPath(import.meta.url));
|
||||||
|
const htmlEntries = Object.fromEntries(
|
||||||
|
readdirSync(frontendRoot)
|
||||||
|
.filter((fileName) => fileName.endsWith('.html'))
|
||||||
|
.map((fileName) => [path.basename(fileName, '.html'), path.join(frontendRoot, fileName)])
|
||||||
|
);
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
root: frontendRoot,
|
||||||
|
publicDir: false,
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
vue: 'vue/dist/vue.esm-bundler.js'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
define: {
|
||||||
|
__VUE_OPTIONS_API__: true,
|
||||||
|
__VUE_PROD_DEVTOOLS__: false,
|
||||||
|
__VUE_PROD_HYDRATION_MISMATCH_DETAILS__: false
|
||||||
|
},
|
||||||
|
build: {
|
||||||
|
target: 'es2020',
|
||||||
|
outDir: 'dist',
|
||||||
|
emptyOutDir: true,
|
||||||
|
rollupOptions: {
|
||||||
|
input: htmlEntries
|
||||||
|
}
|
||||||
|
},
|
||||||
|
server: {
|
||||||
|
proxy: {
|
||||||
|
'/api': 'http://127.0.0.1:40001',
|
||||||
|
'/d': 'http://127.0.0.1:40001',
|
||||||
|
'/s': 'http://127.0.0.1:40001'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user