vue3+vite がパッケージ化されると、ページはサーバー (レベル 1、レベル 2) ディレクトリに配置され、ページは空白になります。nuxt は pm2 を使用してサーバーを公開します

梱包後の白紙ページの対処方法:

第 1 レベルのディレクトリ:

ベース: process.env.NODE_ENV === '本番' ? './' : '/', 

二次プロジェクト: 

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/, '')
        }
      }
    },
  })

}

ルーター.js

const router = createRouter({
  history: createWebHashHistory(),
})

nuxt プロジェクトは構成 pm2 をサーバー上に公開します

1. サーバーに pm2 をインストールします (参照アドレス)

2. プロジェクトがパッケージ化されたら、圧縮のために 3 つのファイルを新しいフォルダーに別々に置きます。

3. 圧縮パッケージをサーバーにアップロードしてプロジェクトを解凍し、プロジェクトに入ってコマンドを実行します

解凍コマンド：圧縮パッケージ名.zipを解凍します。 

npmインストール

npm 実行開始 

ヒント: サーバーを閉じた後に URL にアクセスできない場合は、コマンド npm run start & を実行します。 

バックグラウンドでの実行を許可する(&)

4. PM2スタートアッププロジェクト

pm2 開始プロジェクト名

 pm2 リスト すべてのアイテムを表示

pm2 再起動プロジェクト名 再起動プロジェクト