nuxtjs 无法在生产中显示动态 url [英] nuxtjs cannot display dynamic url on production

问题描述

我正在使用 nuxjs 构建我的项目，并创建了一个动态显示位置信息的页面.

当我运行 npm run dev 并在

请告诉我我的代码有什么问题，我应该怎么做.

谢谢.

解决方案

你必须配置你的 web 服务器来响应 index.html 当收到像 /place/66bb50b7a5

vue-router doc 有 Apache、nginx、IIS...

对于 MAMP (apache):

1. 在您的 MAMP htdocs 文件夹中创建一个文件名 .htaccess
2. 从 vue-router 文档中粘贴 apache 配置

.htaccess:

重写引擎开启重写基数/重写规则 ^index\.html$ - [L]RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-d重写规则./index.html [L]</IfModule>

I'm using nuxjs to build my project and I create a page which displays place information dynamically.

when I run npm run dev and test on http://localhost:3000/place/66bb50b7a5 is work well.

but after I run npm run generate, I get the dist folder, I put in on MAMAP and try to run http://mysite:7074/place/66bb50b7a5, it shows 404 page not found.

My dist folder is like this

please tell me what wrong on my code and what I should do.

Thank you.

解决方案

You have to config your web server to response index.html when receive requests like /place/66bb50b7a5

vue-router doc have example configurations for Apache, nginx, IIS...

For MAMP (apache):

1. create an file name .htaccess in your MAMP htdocs folder
2. paste apache configuration from vue-router doc

.htaccess:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

这篇关于nuxtjs 无法在生产中显示动态 url的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！