How to deal with blank pages after packaging:
First-level directory:
base: process.env.NODE_ENV === 'production' ? './' : '/',
Secondary project:
base: process.env.NODE_ENV === 'production' ? '/prod/secondary directory file name/' : '/', // put the server secondary directory
vite.config.js
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const { resolve } = require('path')
// https://vitejs.dev/config/
export default ({ command, mode }) =>{
return defineConfig({
base: process.env.NODE_ENV === 'production' ? '/prod/二级目录文件名/' : '/',//放服务器二级目录
// base: process.env.NODE_ENV === 'production' ? './' : '/',//服务器一级目录
plugins: [
vue(),
],
define: {
'process.env': {}
},
resolve: {
alias: {
'@': resolve('./src'),
// 'assets': resolve('./src/assets'),
// 'style': resolve('./src/style')
}
},
server: {
// host: process.env.VITE_HOST,
// port: process.env.VITE_PORT,
// 是否自动在浏览器打开
open: false,
// 是否开启 https
https: false,
// 服务端渲染
ssr: false,
// base: process.env.VITE_API_URL,
// outDir: process.env.VITE_OUTPUT_DIR,
proxy: {
'/api': {
target: 'http://xx.xxx.xxx:30000',
// target:import.meta.env.VITE_API_URL,
changeOrigin: true,
rewrite: path => path.replace(/^\/api/, '')
}
}
},
})
}
router.js
const router = createRouter({
history: createWebHashHistory(),
})
The nuxt project publishes the configuration pm2 on the server
1. Install pm2 on the server ( reference address )
2. After the project is packaged, put the 3 files separately in a new folder for compression
3. Upload the compressed package to the server to decompress the project, and enter the project to run the command
Decompression command: unzip compressed package name.zip
npm install
npm run start
Tip: If the URL cannot be accessed after closing the server, run the command npm run start &
& allow to run in background
4. PM2 startup project
pm2 start project name
pm2 list view all items
pm2 restart project name restart project