最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

reactjs - Path route is not found in production - Stack Overflow

programmeradmin4浏览0评论

I am using vite, react js, core ui to develop a web dashboard app.

This is my routes.js

import React from 'react'

const Dashboard = React.lazy(() => import('./views/dashboard'))
const Order = React.lazy(() => import('./views/order'))
const Analytic = React.lazy(() => import('./views/analytic'))
const User = React.lazy(() => import('./views/user'))
const UserGraph = React.lazy(() => import('./views/userGraph'))
const Deeplink = React.lazy(() => import('./views/deeplink'))
const Banner = React.lazy(() => import('./views/banner'))

const routes = [
  { path: '/', exact: true, name: 'Home' },
  { path: '/dashboard', name: 'Dashboard', element: Dashboard },
  { path: '/order', name: 'Order', element: Order },
  { path: '/analytic', name: 'Analytic', element: Analytic },
  { path: '/user', name: 'User', element: User },
  { path: '/userGraph', name: 'Grafik Pengguna', element: UserGraph },
  { path: '/deeplink/:screen', name: 'Deeplink', element: Deeplink },
  { path: '/banner', name: 'Banner', element: Banner },
]

export default routes

And this is my vite.config.mjs

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import path from 'node:path'
import autoprefixer from 'autoprefixer'

export default defineConfig(() => {
  return {
    base: '/',
    build: {
      outDir: 'build',
    },
    css: {
      postcss: {
        plugins: [
          autoprefixer({}), // add options if needed
        ],
      },
      preprocessorOptions: {
        scss: {
          quietDeps: true,
          silenceDeprecations: ['import', 'legacy-js-api'],
        },
      },
    },
    esbuild: {
      loader: 'jsx',
      include: /src\/.*\.jsx?$/,
      exclude: [],
    },
    optimizeDeps: {
      force: true,
      esbuildOptions: {
        loader: {
          '.js': 'jsx',
        },
      },
    },
    plugins: [react()],
    resolve: {
      alias: [
        {
          find: 'src/',
          replacement: `${path.resolve(__dirname, 'src')}/`,
        },
      ],
      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.scss'],
    },
    server: {
      port: 3000,
      proxy: {
        // /config/server-options.html
      },
    },
  }
})

In preview mode (npm run serve) http://localhost:4173/deeplink/detail-article, the route deeplink is sucess. But in production mode , the route deeplink is not found.

Why this is happen?

发布评论

评论列表(0)

  1. 暂无评论