VueJS 2 Router не работает, когда он находится в производственной сборке

Question

Привет люди, у меня есть рабочий проект VueJS в разработке, однако маршрутизатор перестает работать в производственной сборке.

Я проверил онлайн и нашел это решение https://github.com/vuejs-templates/webpack-simple/issues/11 однако оно не дает мне никакой практической информации.

routest.js

import News from './components/frontend/News.vue'
import News1 from './components/frontend/News1.vue'
export const routes = [
{path: '/news', component: News1},
{path: '/', component: News}
];

Мой main.js '

import Vue from 'vue'
import App from './App.vue'

import {routes} from "./routest";
import VueRouter from 'vue-router'

Vue.use(VueRouter);
const router = new VueRouter({
    mode: 'history',
    routes
});
new Vue({
    el: '#app',
    router,
    render: h => h(App)
})

My App.vue

 <template>
 <div id="app">
     <router-view></router-view>
 </div>
 </template>
 <script>
 export default {
 name: 'app',
 data () {
     return {
          msg: 'Welcome to Your Vue.js App'
    }
  }
}

Я предполагаю, что здесь что-то не так

 export const routes = [
 {path: '/news', component: News1},
 {path: '/', component: News}
 ];

Я поставил на свой сервер и ввел с IP. Появляется главная страница, но новости не появляется, когда я захожу по ссылке. Http: // ххх / Новости

Может кто-нибудь помочь, пожалуйста?

ОБНОВЛЕНИЕ 1: https://scotch.io/tutorials/getting-started-with-vue-router если я добавлю

<router-link to="/news">About</router-link>
<router-view></router-view>

На App.Vue я могу нажать с домашней страницы и перейти к новостям. НО я хочу свободы туда по прямой ссылке. Как я могу это сделать?

Обновление 2 Я добавил это в nginx внутри раздела http nginx.conf

server {
   # hostname or ip or multiple separated by spaces
   server_name localhost example.com 192.168.1.1; #change to your setting
  location / {
       try_files $uri $uri/ /index.html;
  }
  }

до сих пор, когда я запрашиваю ссылку непосредственно с сервера, она не идет. Еще когда я хотел точную ссылку с сервера он ничего не показывал

ОТВЕТ: Итак, место, куда я положил, было nginx.conf. Я поместил этот сервер { tag внутри http {

Я проверил и нашел include /etc/nginx/sites-enabled/*; Я заглянул внутрь, и там был default.cnf, в котором я увидел, что там уже есть server { tag и там есть раздел location.

Я просто изменил этот раздел в соответствии с требованием VUEJS, и тогда это сработало. Спасибо за поддержку.

Answer 1

Вы должны поместить это в свой nginx.conf:

http {
   ## ...
   ## other configuration

   server {
        listen 80;

        server_name yourservername.com;
        root html/path_to_your_project;

        index index.php index.html;

        location / {
            try_files $uri $uri/ /index.html;
        }
    }
}

Это рабочая конфигурация для меня. Убедитесь, что вы очистили кэш DNS и перезапустили Nginx.