import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import { svgBuilder } from './src/components/SvgIcon/svgBuilder' const { resolve,path } = require('path') const PrerenderSPAPlugin = require('prerender-spa-plugin') const Renderer = PrerenderSPAPlugin.PuppeteerRenderer; // https://vitejs.dev/config/ export default defineConfig({ productionSourceMap: false, lintOnSave: false, //关闭Eslint plugins: [ vue(), svgBuilder('./src/assets/icon/') // svg图标批量引入 ], configureWebpack: config => { config.plugins.push( new PrerenderSPAPlugin({ staticDir: path.join(__dirname, 'dist'), // 需要进行预渲染的路由路径 routes: ['/about'], // html文件压缩 minify: { minifyCSS: true, // css压缩 removeComments: true // 移除注释 }, renderer: new Renderer({ inject: { // foo: 'bar' }, // 在 main.js 中 new Vue({ mounted () {document.dispatchEvent(new Event('render-event'))}}),两者的事件名称要对应上。 // renderAfterDocumentEvent: 'render-event' renderer: new PrerenderSPAPlugin.PuppeteerRenderer({ //这样写renderAfterTime生效了 renderAfterTime: 5000 }) }) }) ) }, resolve: { alias: [ // 别名配置 { find: '@', replacement: resolve(__dirname, 'src') } ] }, define: { buildTime: JSON.stringify(new Date().toLocaleString()) }, css: { preprocessorOptions: { less: { modifyVars: { hack: `true; @import (reference) "${resolve('src/assets/css/global.less')}";` }, javascriptEnabled: true } } }, server: { hrm: true, usePolling: true, // 服务器主机名 host: 'localhost', // 端口号 port: 3200, // 设为 true 时若端口已被占用则会直接退出,而不是尝试下一个可用端口 strictPort: false, // 服务器启动时自动在浏览器中打开应用程序,当此值为字符串时,会被用作 URL 的路径名 open: false, // 自定义代理规则 proxy: { // 选项写法 '/api': { target: 'http://jsonplaceholder.typicode.com', changeOrigin: true, rewrite: path => path.replace(/^\/api/, '') } } } })