Github 페이지의 VueJS 앱 공백 페이지

Github 페이지의 VueJS 앱 공백 페이지

아래 저장소의 gh-pages 분기에 Vue 앱을 배포했습니다.

그러나 https://christopherkade.com/STracker에 접속하면 Firefox에서 다음 오류가 발생합니다(다른 브라우저에서도 마찬가지 오류).

소스 "https://christopherkade.com/static/js/manifest.5f330dcceda3a8431045.js"의 로드에 실패했습니다.

소스 "https://christopherkade.com/static/js/vendor.d99d5ed4cd2156cc1a6f.js"의 로드에 실패했습니다.

소스 "https://christopherkade.com/static/js/app.ccc0f9d5d6f02f3b3285.js"의 로드에 실패했습니다.

변경해 보았습니다.assetsPublicPath로.'./'에config/index.js라고 덧붙였습니다.<base href="/">나의 것index.html.

무엇이 이러한 경로 문제의 원인일 수 있습니까?

제가 한 일은 /dist 폴더의 index.html 파일을 변경한 것입니다./를 정적에서 제거합니다.문서 폴더에 복사해 주세요.내 github 페이지는 그 지점을 가리키고 있다.

패키지에는 '퍼블리시' 스크립트가 있습니다.이 작업을 자동으로 수행하도록 설정합니다.

"publish": "npm run build && rm -rf docs; cp -r dist docs && sed -i -e 's/src=\\//src=/g' docs/index.html ; sed -i -e 's/href=\\//href=/g' docs/index.html"

간단한 웹 팩템플릿 https://github.com/vitogit/vue-chessboard-examples 를 사용하는 예.웹 팩템플릿 https://github.com/vitogit/vue-chess-guardian 를 사용하는 다른 예.

마찬가지로 stackoverflow와 github 게시물 및 vue 도입 지침(https://cli.vuejs.org/guide/deployment.html)에 따라 약간의 시행착오를 겪었습니다.삭제해 본 적이 없기 때문에 이 모든 변경을 할 필요가 있는지 모르겠습니다만, 이것이 동작하는 변경의 전체 리스트입니다.

1. 프로젝트 루트에 vue.config.js 파일을 만들고 내 repo 이름으로 publicPath 설정을 추가합니다.(public Path: '/')
2. vue 라우터 모드를 기록에서 해시로 변경(모드: '해시')
3. config index.js 파일에서 경로를 삭제하는 중입니다.이를 수행하려면 assetsPublicPath:/'를 assetsPublicPath: '로 변경합니다.이는 일부 응답에 따라서는 index.html 파일에서 수동으로 실행하는 것보다 더 깨끗할 수 있습니다.
4. 라우터 index.js 파일의 vue 라우터 베이스 추가/변경(base: '/')
5. 이러한 모든 변경이 이루어진 후 프로젝트 구축
6. 프로젝트의 전개.난 전체 배치를 따르지 않았다.sh 지시사항그러나 제가 사용한 git 명령어는 파일을 추가하고(git add – A), 파일을 커밋하고(git commit – m 'deploy'), 배포 파일을 gh-pages 브랜치(git subtree push --prefix dist origin gh-pages)에 푸시하는 것이었습니다.물론 모든 것을 추가하고 커밋하지만 vue 지침은 더 초점이 맞춰집니다.
7. gh-pages 브런치를 가리키도록 github 페이지 설정.

어쩔 수 했어요.publicPathvue.config.js.

module.exports = {
  publicPath: process.env.NODE_ENV === 'production'
  ? '/GitHub-Repo-Name/'
  : '/'
}

저는 , 음, 음, 음, 음, 음, 음, 음, 。https://username.github.io/GitHub-Repo-Name/

언급URL : https://stackoverflow.com/questions/48548533/blank-page-for-a-vuejs-app-on-github-pages