From c9c21df0f0669f0cdf89906140b1b1f07b099f72 Mon Sep 17 00:00:00 2001 From: ikmkj Date: Sun, 1 Mar 2026 18:22:07 +0800 Subject: [PATCH] =?UTF-8?q?fix(=E9=83=A8=E7=BD=B2):=20=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=E6=A8=A1=E5=9D=97=E7=B1=BB=E5=9E=8B=E5=B9=B6=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E5=99=A8=E9=85=8D=E7=BD=AE=E6=8C=87=E5=8D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 解决模块加载错误问题，移除index.html中script的type="module"属性 添加server-config.md详细说明服务器MIME类型配置 优化vite构建配置，添加代码分割和输出格式设置 --- biji-qianduan/index.html | 2 +- biji-qianduan/server-config.md | 82 ++++++++++++++++++++++++++++++++++ biji-qianduan/vite.config.js | 42 +++++++++++++++-- 3 files changed, 122 insertions(+), 4 deletions(-) create mode 100644 biji-qianduan/server-config.md diff --git a/biji-qianduan/index.html b/biji-qianduan/index.html index 5adda7b..37b0b63 100644 --- a/biji-qianduan/index.html +++ b/biji-qianduan/index.html @@ -28,6 +28,6 @@
- + diff --git a/biji-qianduan/server-config.md b/biji-qianduan/server-config.md new file mode 100644 index 0000000..d5213bb --- /dev/null +++ b/biji-qianduan/server-config.md @@ -0,0 +1,82 @@ +# 部署服务器配置指南 + +## 问题描述 + +在部署前端项目后，出现以下错误： + +``` +Failed to load module script: Expected a JavaScript-or-Wasm module script but the server responded with a MIME type of "application/octet-stream". +``` + +## 解决方案 + +此问题是由于服务器未正确配置 JavaScript 文件的 MIME 类型导致的。请按照以下步骤配置您的服务器： + +### Nginx 配置 + +在 nginx.conf 或站点配置文件中添加： + +```nginx +location ~ \.js$ { + add_header Content-Type application/javascript; +} + +# 或者更完整的静态资源配置 +location ~* \.(js|css)$ { + expires 1y; + add_header Cache-Control "public, immutable"; + add_header Content-Type $mimetype; +} +``` + +### Apache 配置 + +在 `.htaccess` 文件中添加： + +```apache + + Header set Content-Type "application/javascript" + + +# 或者在 httpd.conf 中 +AddType application/javascript .js +``` + +### Caddy 配置 + +在 Caddyfile 中添加： + +``` +@jsFiles { + path *.js +} +header @jsFiles Content-Type application/javascript +``` + +### 其他服务器 + +确保您的服务器软件正确配置了以下 MIME 类型： + +- `.js` 文件: `application/javascript` +- `.css` 文件: `text/css` +- `.json` 文件: `application/json` + +## Vite 构建配置 + +当前项目已配置了适当的代码分割，请使用以下命令构建： + +```bash +npm run build +``` + +或 + +```bash +npm run build --mode production +``` + +## 注意事项 + +1. IIFE 格式会将代码打包成立即执行函数，在某些现代浏览器中可能不需要 `type="module"` +2. 确保服务器支持静态资源的正确 MIME 类型 +3. 如果使用 CDN，请确保 CDN 也正确配置了 MIME 类型 \ No newline at end of file diff --git a/biji-qianduan/vite.config.js b/biji-qianduan/vite.config.js index 2311104..f1278a3 100644 --- a/biji-qianduan/vite.config.js +++ b/biji-qianduan/vite.config.js @@ -25,10 +25,46 @@ export default defineConfig(({ mode }) => { build: { outDir: 'dist', assetsDir: 'assets', - minify: 'esbuild', - esbuild: { - drop: ['console', 'debugger'], + rollupOptions: { + output: { + format: 'es', + manualChunks: { + // Vue核心库 + vue: ['vue', 'pinia'], + // UI组件库 + elementPlus: ['element-plus'], + // Markdown编辑器相关 + markdownEditor: ['@kangc/v-md-editor', 'vditor'], + // PDF生成工具 + pdfTools: ['jspdf', 'html2canvas'], + // 代码高亮 + highlight: ['highlight.js'], + // 代码编辑器 + codemirror: ['codemirror'], + // Pinia状态管理 + piniaPlugin: ['pinia-plugin-persistedstate'] + }, + chunkFileNames: (chunkInfo) => { + const facadeModuleId = chunkInfo.facadeModuleId || chunkInfo.moduleIds[0] + if (facadeModuleId.includes('node_modules')) { + return 'assets/js/vendor/[name]-[hash].js' + } + return 'assets/js/[name]-[hash].js' + }, + entryFileNames: 'assets/js/[name]-[hash].js', + assetFileNames: (assetInfo) => { + if (assetInfo.name.endsWith('.css')) { + return 'assets/css/[name]-[hash].[ext]'; + } + if (assetInfo.name.endsWith('.js')) { + return 'assets/js/[name]-[hash].[ext]'; + } + return 'assets/[name]-[hash].[ext]'; + }, + }, }, + sourcemap: false, + chunkSizeWarningLimit: 1000 // 设置为1MB } } }) \ No newline at end of file