dev: 优化开发环境

package.json

@@ -24,6 +24,7 @@
         "@traptitech/markdown-it-katex": "^3.6.0",
         "autoprefixer": "^10.4.13",
         "axios": "^0.24.0",
+        "chokidar": "^4.0.1",
         "codemirror": "^5.65.16",
         "cross-env": "^7.0.3",
         "css-loader": "^6.7.2",

vite.config.js

@@ -1,18 +1,20 @@
-import {resolve} from "path";
+import fs from "fs";
-import {writeFileSync, existsSync, unlinkSync} from "fs";
+import path from "path";
 import {execSync} from "child_process";
 import {defineConfig, loadEnv} from 'vite'
 import {createVuePlugin} from 'vite-plugin-vue2';
 import vitePluginRequire from 'vite-plugin-require'
 import vitePluginFileCopy from 'vite-plugin-file-copy';
 import autoprefixer from 'autoprefixer';
+import chokidar from 'chokidar';
 
 const argv = process.argv;
 const basePath = argv.includes('electronBuild') ? './' : '/';
 const publicPath = argv.includes('electronBuild') ? 'electron/public' : 'public';
+const staticDir = {src: path.resolve(__dirname, 'resources/assets/statics/public'), dest: path.resolve(__dirname, publicPath)}
 
 if (!argv.includes('fromcmd')) {
-    execSync(`npx ${resolve(__dirname, 'cmd')} ${argv.includes("build") ? "build" : "dev"}`, {stdio: "inherit"});
+    execSync(`npx ${path.resolve(__dirname, 'cmd')} ${argv.includes("build") ? "build" : "dev"}`, {stdio: "inherit"});
     process.exit()
 }
 
@@ -22,22 +24,59 @@ export default defineConfig(({command, mode}) => {
     const port = parseInt(env['APP_DEV_PORT'])
 
     if (command === 'serve') {
-        const hotFile = resolve(__dirname, 'public/hot')
+        const hotFile = path.resolve(__dirname, 'public/hot')
         const hotClean = (exit) => {
-            if (existsSync(hotFile)) {
+            if (fs.existsSync(hotFile)) {
-                unlinkSync(hotFile);
+                fs.unlinkSync(hotFile);
             }
             if (exit) {
                 process.exit()
             }
         }
         hotClean(false)
-        writeFileSync(hotFile, JSON.stringify(env));
+        fs.writeFileSync(hotFile, JSON.stringify(env));
         process.on('exit', () => hotClean(true));
         process.on('SIGINT', () => hotClean(true));
         process.on('SIGHUP', () => hotClean(true));
     }
 
+    const plugins = [
+        createVuePlugin({
+            template: {
+                compilerOptions: {
+                    isCustomElement: (tag) => tag.includes('micro-app'),
+                }
+            }
+        }),
+        vitePluginRequire(),
+        vitePluginFileCopy([staticDir])
+    ]
+    if (mode === "development") {
+        plugins.push({
+            name: 'watch-copy',
+            configureServer() {
+                chokidar.watch(staticDir.src, {
+                    ignoreInitial: true,
+                }).on('all', (event, filePath) => {
+                    if (['add', 'change', 'unlink'].includes(event)) {
+                        const relativePath = path.relative(staticDir.src, filePath);
+                        const destPath = path.resolve(staticDir.dest, relativePath);
+                        if (event === 'unlink') {
+                            if (fs.existsSync(destPath)) {
+                                fs.unlinkSync(destPath);
+                                console.log(`Removed ${destPath}`);
+                            }
+                        } else {
+                            fs.mkdirSync(path.dirname(destPath), {recursive: true});
+                            fs.copyFileSync(filePath, destPath);
+                            console.log(`Copied ${filePath} to ${destPath}`);
+                        }
+                    }
+                });
+            }
+        })
+    }
+
     return {
         base: basePath,
         publicDir: publicPath,
@@ -48,11 +87,11 @@ export default defineConfig(({command, mode}) => {
         },
         resolve: {
             alias: {
-                '~element-sea': resolve(__dirname, 'node_modules/element-sea'),
+                '~element-sea': path.resolve(__dirname, 'node_modules/element-sea'),
-                '~quill-hi': resolve(__dirname, 'node_modules/quill-hi'),
+                '~quill-hi': path.resolve(__dirname, 'node_modules/quill-hi'),
-                '~quill-mention-hi': resolve(__dirname, 'node_modules/quill-mention-hi'),
+                '~quill-mention-hi': path.resolve(__dirname, 'node_modules/quill-mention-hi'),
-                '../images': resolve(__dirname, command === 'serve' ? '/images' : 'resources/assets/statics/public/images'),
+                '../images': path.resolve(__dirname, command === 'serve' ? '/images' : 'resources/assets/statics/public/images'),
-                '../css': resolve(__dirname, command === 'serve' ? '/css' : 'resources/assets/statics/public/css')
+                '../css': path.resolve(__dirname, command === 'serve' ? '/css' : 'resources/assets/statics/public/css')
             },
             extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
         },
@@ -74,20 +113,7 @@ export default defineConfig(({command, mode}) => {
             brotliSize: false,
             chunkSizeWarningLimit: 1500,
         },
-        plugins: [
+        plugins,
-            createVuePlugin({
-                template: {
-                    compilerOptions: {
-                        isCustomElement: (tag) => tag.includes('micro-app') ,
-                    }
-                }
-            }),
-            vitePluginRequire(),
-            vitePluginFileCopy([{
-                src: resolve(__dirname, 'resources/assets/statics/public'),
-                dest: resolve(__dirname, publicPath)
-            }]),
-        ],
         css: {
             postcss: {
                 plugins: [