12 changed files with 303 additions and 33 deletions
-
2.env.production
-
43build/utils.js
-
44build/vite/build.js
-
26build/vite/plugin/autoImport.js
-
21build/vite/plugin/autocomponents.js
-
34build/vite/plugin/compress.js
-
37build/vite/plugin/index.js
-
19build/vite/plugin/mock.js
-
43build/vite/proxy.js
-
7src/style.css
-
7src/views/DZP1.vue
-
53vite.config.js
@ -0,0 +1,43 @@ |
|||||
|
import fs from 'fs' |
||||
|
import path from 'path' |
||||
|
|
||||
|
// 移除未使用的导入
|
||||
|
/** |
||||
|
* 是否是 dev 环境 |
||||
|
* @export |
||||
|
* @param {string} mode |
||||
|
* @return {boolean} |
||||
|
*/ |
||||
|
export function isDevFn(mode) { |
||||
|
return mode === 'development'; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 是否是 prod 环境 |
||||
|
* @export |
||||
|
* @param {string} mode |
||||
|
* @return {boolean} |
||||
|
*/ |
||||
|
export function isProdFn(mode) { |
||||
|
return mode === 'production'; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Read all environment variable configuration files to process.env |
||||
|
*/ |
||||
|
export function wrapperEnv(envConf) { |
||||
|
const ret = {}; |
||||
|
|
||||
|
for (const envName of Object.keys(envConf)) { |
||||
|
let realName = envConf[envName].replace(/\\n/g, '\n'); |
||||
|
realName = realName === 'true' ? true : realName === 'false' ? false : realName; |
||||
|
|
||||
|
ret[envName] = realName; |
||||
|
if (typeof realName === 'string') { |
||||
|
process.env[envName] = realName; |
||||
|
} else if (typeof realName === 'object') { |
||||
|
process.env[envName] = JSON.stringify(realName); |
||||
|
} |
||||
|
} |
||||
|
return ret; |
||||
|
} |
@ -0,0 +1,44 @@ |
|||||
|
export function createBuild(viteEnv) { |
||||
|
const { VITE_OUTPUT_DIR } = viteEnv; |
||||
|
return { |
||||
|
sourcemap: false, // 是否启用
|
||||
|
outDir: VITE_OUTPUT_DIR, |
||||
|
cssCodeSplit: true, // 禁用 CSS 代码拆分,将整个项目中的所有 CSS 将被提取到一个 CSS 文件中
|
||||
|
brotliSize: false, // 关闭打包计算
|
||||
|
target: 'esnext', |
||||
|
minify: 'terser', // 混淆器, terser 构建后文件体积更小, esbuild
|
||||
|
// 小于此阈值的导入或引用资源将内联为 base64 编码,以避免额外的 http 请求。设置为 0 可以完全禁用此项
|
||||
|
assetsInlineLimit: 4096, |
||||
|
chunkSizeWarningLimit: 2000, // chunk 大小警告的限制(以 kbs 为单位)
|
||||
|
assetsDir: 'static', // 静态资源目录
|
||||
|
// rollup 打包配置
|
||||
|
rollupOptions: { |
||||
|
output: { |
||||
|
chunkFileNames: 'static/js/[name]-[hash].js', |
||||
|
entryFileNames: 'static/js/[name]-[hash].js', |
||||
|
assetFileNames: (chunkInfo) => { |
||||
|
if (chunkInfo.name) { |
||||
|
const info = chunkInfo.name.split('.'); |
||||
|
let extType = info[info.length - 1]; |
||||
|
if (/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i.test(chunkInfo.name)) { |
||||
|
extType = 'media'; |
||||
|
} else if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(chunkInfo.name)) { |
||||
|
extType = 'images'; |
||||
|
} else if (/\.(woff2?|eot|ttf|otf)(\?.*)?$/i.test(chunkInfo.name)) { |
||||
|
extType = 'fonts'; |
||||
|
} |
||||
|
return `static/${extType}/[name]-[hash][extname]`; |
||||
|
} |
||||
|
return 'static/[ext]/[name]-[hash].[ext]'; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
// 压缩配置
|
||||
|
terserOptions: { |
||||
|
compress: { |
||||
|
drop_console: false, // 生产环境移除console
|
||||
|
drop_debugger: true // 生产环境移除debugger
|
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
} |
@ -0,0 +1,26 @@ |
|||||
|
/** |
||||
|
* Introduces component library styles on demand. |
||||
|
* https://github.com/antfu/unplugin-auto-import
|
||||
|
*/ |
||||
|
import AutoImport from 'unplugin-auto-import/vite' |
||||
|
|
||||
|
export function configAutoImportPlugin() { |
||||
|
return AutoImport({ |
||||
|
include: [ |
||||
|
/\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
|
||||
|
/\.vue$/, |
||||
|
/\.vue\?vue/, // .vue
|
||||
|
/\.md$/ // .md
|
||||
|
], |
||||
|
imports: ['vue', 'vue-router', '@vueuse/core'], |
||||
|
// 可以选择auto-import.d.ts生成的位置,使用ts建议设置为'src/auto-import.d.ts'
|
||||
|
dts: 'src/auto-import.d.ts', |
||||
|
// eslint globals Docs - https://eslint.org/docs/user-guide/configuring/language-options#specifying-globals
|
||||
|
// 生成全局声明文件,给eslint用
|
||||
|
eslintrc: { |
||||
|
enabled: true, // Default `false`
|
||||
|
filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
|
||||
|
globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
|
||||
|
} |
||||
|
}) |
||||
|
} |
@ -0,0 +1,21 @@ |
|||||
|
/** |
||||
|
* Introduces component library styles on demand. |
||||
|
* https://github.com/antfu/unplugin-vue-components
|
||||
|
*/ |
||||
|
import Components from 'unplugin-vue-components/vite' |
||||
|
import ViteComponents, { VantResolver } from 'unplugin-vue-components/resolvers' |
||||
|
|
||||
|
export function configAutoComponentsPlugin() { |
||||
|
return Components({ |
||||
|
// 指定组件位置,默认是src/components
|
||||
|
dirs: ['src/components'], |
||||
|
extensions: ['vue', 'tsx'], |
||||
|
// 配置文件生成位置
|
||||
|
dts: 'src/components.d.ts', |
||||
|
// 搜索子目录
|
||||
|
deep: true, |
||||
|
// 允许子目录作为组件的命名空间前缀。
|
||||
|
directoryAsNamespace: false |
||||
|
// include:[]
|
||||
|
}) |
||||
|
} |
@ -0,0 +1,34 @@ |
|||||
|
/** |
||||
|
* Used to package and output gzip. Note that this does not work properly in Vite, the specific reason is still being investigated |
||||
|
* https://github.com/anncwb/vite-plugin-compression
|
||||
|
*/ |
||||
|
import compressPlugin from 'vite-plugin-compression' |
||||
|
|
||||
|
export function configCompressPlugin( |
||||
|
compress, |
||||
|
deleteOriginFile = false |
||||
|
) { |
||||
|
const compressList = compress.split(',') |
||||
|
|
||||
|
const plugins = [] |
||||
|
|
||||
|
if (compressList.includes('gzip')) { |
||||
|
plugins.push( |
||||
|
compressPlugin({ |
||||
|
ext: '.gz', |
||||
|
deleteOriginFile |
||||
|
}) |
||||
|
) |
||||
|
} |
||||
|
|
||||
|
if (compressList.includes('brotli')) { |
||||
|
plugins.push( |
||||
|
compressPlugin({ |
||||
|
ext: '.br', |
||||
|
algorithm: 'brotliCompress', |
||||
|
deleteOriginFile |
||||
|
}) |
||||
|
) |
||||
|
} |
||||
|
return plugins |
||||
|
} |
@ -0,0 +1,37 @@ |
|||||
|
import vue from '@vitejs/plugin-vue' |
||||
|
import vueJsx from '@vitejs/plugin-vue-jsx' |
||||
|
// import { configMockPlugin } from './mock'
|
||||
|
import { configAutoImportPlugin } from './autoImport' |
||||
|
import { configAutoComponentsPlugin } from './autocomponents' |
||||
|
import { configCompressPlugin } from './compress' |
||||
|
|
||||
|
export function createVitePlugins(viteEnv, isBuild) { |
||||
|
const { VITE_USE_MOCK, VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE } = viteEnv |
||||
|
|
||||
|
const vitePlugins = [ |
||||
|
// have to
|
||||
|
vue(), |
||||
|
// have to
|
||||
|
vueJsx({ |
||||
|
// include: /\.(jsx|tsx)/
|
||||
|
}) |
||||
|
] |
||||
|
|
||||
|
// unplugin-vue-components
|
||||
|
vitePlugins.push(configAutoComponentsPlugin()) |
||||
|
|
||||
|
// unplugin-auto-import
|
||||
|
vitePlugins.push(configAutoImportPlugin()) |
||||
|
|
||||
|
// // vite-plugin-mock
|
||||
|
// VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild))
|
||||
|
|
||||
|
// The following plugins only work in the production environment
|
||||
|
if (isBuild) { |
||||
|
// rollup-plugin-gzip
|
||||
|
vitePlugins.push( |
||||
|
configCompressPlugin(VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE) |
||||
|
) |
||||
|
} |
||||
|
return vitePlugins |
||||
|
} |
@ -0,0 +1,19 @@ |
|||||
|
/** |
||||
|
* Mock plugin for development and production. |
||||
|
* https://github.com/anncwb/vite-plugin-mock
|
||||
|
*/ |
||||
|
// import { viteMockServe } from 'vite-plugin-mock'
|
||||
|
|
||||
|
// export function configMockPlugin(isBuild: boolean) {
|
||||
|
// return viteMockServe({
|
||||
|
// ignore: /^_/,
|
||||
|
// mockPath: 'mock',
|
||||
|
// localEnabled: !isBuild,
|
||||
|
// prodEnabled: isBuild,
|
||||
|
// injectCode: `
|
||||
|
// import { setupProdMockServer } from '../mock/_createProductionServer';
|
||||
|
// setupProdMockServer();
|
||||
|
// `
|
||||
|
// })
|
||||
|
// }
|
||||
|
export {} |
@ -0,0 +1,43 @@ |
|||||
|
/** |
||||
|
* Generate proxy |
||||
|
* @param list |
||||
|
*/ |
||||
|
|
||||
|
export function createProxy() { |
||||
|
return { |
||||
|
// 字符串简写写法
|
||||
|
// '/foo': 'http://localhost:4567',
|
||||
|
// 选项写法
|
||||
|
// '/api': {
|
||||
|
// target: process .env.VITE_APP_API_BASE_URL || 'http://192.168.8.93:3001',
|
||||
|
// changeOrigin: true,
|
||||
|
// rewrite: (path) => path.replace(/^\/api/, '')
|
||||
|
// },
|
||||
|
// // 全球指数
|
||||
|
// '/hcm': {
|
||||
|
// target: process.env.VITE_APP_API_BASE_URL_HCM || 'http://192.168.8.93:3001',
|
||||
|
// changeOrigin: true,
|
||||
|
// rewrite: (path) => path.replace(/^\/hcm/, '')
|
||||
|
// },
|
||||
|
// // 时空预测
|
||||
|
// '/pre': {
|
||||
|
// target: process.env.VITE_APP_API_BASE_URL_AI || 'http://192.168.8.93:3001',
|
||||
|
// changeOrigin: true,
|
||||
|
// rewrite: (path) => path.replace(/^\/pre/, '')
|
||||
|
// }
|
||||
|
// 正则表达式写法
|
||||
|
// '^/fallback/.*': {
|
||||
|
// target: 'http://jsonplaceholder.typicode.com',
|
||||
|
// changeOrigin: true,
|
||||
|
// rewrite: (path) => path.replace(/^\/fallback/, '')
|
||||
|
// }
|
||||
|
// 使用 proxy 实例
|
||||
|
// "/api": {
|
||||
|
// target: "http://jsonplaceholder.typicode.com",
|
||||
|
// changeOrigin: true,
|
||||
|
// configure: (proxy, options) => {
|
||||
|
// // proxy 是 'http-proxy' 的实例
|
||||
|
// },
|
||||
|
// },
|
||||
|
} |
||||
|
} |
@ -1,26 +1,29 @@ |
|||||
import { defineConfig } from 'vite' |
|
||||
import vue from '@vitejs/plugin-vue' |
|
||||
import { resolve } from 'path' //
|
|
||||
|
import { defineConfig,loadEnv } from "vite"; |
||||
|
import { wrapperEnv } from "./build/utils"; |
||||
|
import vue from "@vitejs/plugin-vue"; |
||||
|
import { resolve } from "path"; //
|
||||
|
|
||||
export default defineConfig({ |
|
||||
plugins: [vue()], //
|
|
||||
server: { |
|
||||
host: '192.168.1.102', |
|
||||
port: 5173, |
|
||||
// 错误1:server 块内不能嵌套 plugins 配置(已删除)
|
|
||||
proxy: { |
|
||||
'/api': { |
|
||||
target: 'http://192.168.99.223:3000', |
|
||||
changeOrigin: true, |
|
||||
rewrite: (path) => path.replace(/^\/api/, '') |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
resolve: { //
|
|
||||
alias: { |
|
||||
"/@": resolve(__dirname, "src"), //
|
|
||||
} |
|
||||
}, |
|
||||
base: process.env.NODE_ENV === "production" ? "/dazhuanpan" : "/", |
|
||||
|
|
||||
}) |
|
||||
|
export default defineConfig(({ command, mode }) => { |
||||
|
const root = process.cwd(); |
||||
|
const env = loadEnv(mode, root); |
||||
|
const viteEnv = wrapperEnv(env); |
||||
|
const { VITE_PUBLIC_PATH, VITE_OUTPUT_DIR } = viteEnv; |
||||
|
return { |
||||
|
base: VITE_PUBLIC_PATH, |
||||
|
plugins: [vue()], //
|
||||
|
server: { |
||||
|
host: "192.168.1.102", |
||||
|
port: 5173, |
||||
|
// 错误1:server 块内不能嵌套 plugins 配置(已删除)
|
||||
|
proxy: { |
||||
|
"/api": { |
||||
|
target: "http://192.168.99.223:3000", |
||||
|
changeOrigin: true, |
||||
|
rewrite: (path) => path.replace(/^\/api/, ""), |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
resolve: { |
||||
|
}, |
||||
|
}; |
||||
|
}); |
Write
Preview
Loading…
Cancel
Save
Reference in new issue