Vue에서 경로 # 번호를 제거하는 방법

php中世界最好的语言
풀어 주다: 2018-04-27 16:22:14
원래의
1326명이 탐색했습니다.

이번에는 Vue에서 경로 # 번호를 제거하는 방법과 Vue에서 경로 # 번호를 제거하는 주의 사항이 무엇인지 보여드리겠습니다. 실제 사례를 살펴보겠습니다.

우리 모두 알고 있듯이 vue-router에는 해시 모드와 히스토리 모드의 두 가지 모드가 있습니다.

#이 있는 것이 해시 모드입니다.

라우터의 모드를 기록으로 설정하면 됩니다

그러다가 인터페이스를 새로 고치자마자 404로 변경되는 문제가 발생합니다! ! ! !

온라인으로 검색한 후 백엔드 환경을 구성해야 합니다.

여기에는 nginx 구성만 나열되어 있습니다. 다른 구성을 보려면 여기를 클릭하여 공식 웹사이트로 이동하세요.

먼저 config/index.js를 구성하세요

assetsPublicPath를 루트 디렉터리로 수정하세요

module.exports = {
  build: {
      env: require('./prod.env'),
      index: path.resolve(dirname, '../dist/index.html'),
      assetsRoot: path.resolve(dirname, '../dist'),
      assetsSubDirectory: 'static',
      assetsPublicPath: '/',   // hash 模式会默认的在此处 添加为 assetsPublicPath: './'
      productionSourceMap: true,
      ...
    }
}
로그인 후 복사

그런 다음 nignx를 구성하세요

server {
    listen 0.0.0.0:12345;
    location / {
        root /home/我的应用跟目录;
        try_files $uri $uri/ /index.html =404;  // 这个是重点
    }
    error_page 404 /index.html
}
로그인 후 복사

Url에는 더 이상 #, more Perfect

이 기사의 사례를 읽은 후 방법을 마스터했다고 믿습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사에 주목하세요!

추천 도서:

vue

요소 순회 구현에 대한 자세한 설명

요소 순회 구현🎜🎜🎜

위 내용은 Vue에서 경로 # 번호를 제거하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿