vue3+vite打包之后，页面放在服务器（一级，二级）目录下，页面空白,nuxt使用pm2发布服务器

打包之后页面空白处理方式：

一级目录：

base: process.env.NODE_ENV === 'production' ? './' : '/', 

二级项目： 

base: process.env.NODE_ENV === 'production' ? '/prod/二级目录文件名/' : '/',//放服务器二级目录

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(),
})

nuxt项目在服务器发布配置pm2

1、在服务器安装pm2（参考地址）

2、项目打包之后把3个文件单独放在新文件夹中进行压缩

扫描二维码关注公众号，回复： 15207681 查看本文章

3、压缩包上传服务器解压项目，进入项目运行命令

解压命令：unzip 压缩包名称.zip 

npm install

npm run start 

小提示：如果关闭服务器之后，网址不能访问的话，运行命令npm run start & 

&允许在后台运行

4、pm2启动项目

pm2 start 项目名称

 pm2 list查看所有项目

pm2 restart 项目名称    重启项目