3

我使用 vue.js 和 vue.config.js 方法创建了一个多页面应用程序我开发它没有问题我创建了一个生产版本我可以访问主页但是我无法访问其他页面，例如关于我们、投资组合等。

可能是什么问题？？以及如何解决？是关于 .htacess 的吗？

这是我的 vue.config.js 代码

module.exports = {
    pages: {
      index: {
        entry: './src/pages/Home/main.js',
        template: 'public/index.html',
        title: 'Welcome to Appclust',
        chunks: ['chunk-vendors', 'chunk-common', 'index']
      },
      about:{
        entry: './src/pages/About/main.js',
        template: 'public/index.html',
        title: 'About us',
        chunks: ['chunk-vendors', 'chunk-common', 'about']
      },
      portfolio:{
        entry: './src/pages/Portfolio/main.js',
        template: 'public/index.html',
        title: 'Portfolio',
        chunks: ['chunk-vendors', 'chunk-common', 'portfolio']
      },
      testimonials:{
        entry: './src/pages/Testimonials/main.js',
        template: 'public/index.html',
        title: 'Testimonials',
        chunks: ['chunk-vendors', 'chunk-common', 'testimonials ']
      },
      careers:{
        entry: './src/pages/Careers/main.js',
        template: 'public/index.html',
        title: 'Careers',
        chunks: ['chunk-vendors', 'chunk-common', 'careers']
      },
      contact:{
        entry: './src/pages/Contact/main.js',
        template: 'public/index.html',
        title: 'Contact',
        chunks: ['chunk-vendors', 'chunk-common', 'contact']
      }
    }
  }

这是我的文件结构 在此处输入图像描述

生产文件

在此处输入图像描述

4

1 回答 1

2
  1. mode:history在没有 hashbang 的 vue-router 中启用漂亮的 URL
  2. 由于您的项目从一开始就是 SPA，因此在新访问/刷新路线后，爬虫/服务器无法识别您的路线（因为/about缺少 index.html 预期。）
  3. 是的，您可以.htaccess在缺少的路由中设置重定向规则。
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# otherwise use history router
RewriteRule ^ /index.html
  1. 可选：如果您希望为每个路由生成预渲染的静态 HTML 文件，prerender-spa-plugin是您项目构建的一个很好的补充。如果您想从头开始构建 MPA，请转到 NUXT。
于 2020-07-02T06:44:55.993 回答