[javascript] GitHub에서 호스팅되는 외부 JavaScript 파일 연결 및 실행

GitHub Pages 는이 문제에 대한 GitHub의 공식 솔루션입니다.

raw.githubusercontenttext/plain파일이 CSS 또는 JavaScript 파일 인 경우에도 모든 파일이 MIME 유형을 사용하도록 합니다. 따라서 https://raw.githubusercontent.com/‹user›/‹repo›/‹branch›/‹filepath›올바른 MIME 형식이 아닌 일반 텍스트 파일이되고이를 통해 링크 <link href="..."/>하거나 <script src="..."></script>작동하지 않습니다. CSS가 적용되지 않습니다 / JS가 실행되지 않습니다.

GitHub Pages 는 리포지토리를 특수 URL로 호스팅하므로 파일을 체크인하고 푸시하기 만하면됩니다. 대부분의 경우, GitHub Pages에서는 특수 분기에 커밋해야합니다 gh-pages.

일반적으로의 새 사이트 https://‹user›.github.io/‹repo›에서 gh-pages브랜치에 커밋 된 모든 파일 (가장 최근 커밋)이이 URL에 있습니다. 따라서를 통해 js 파일에 연결할 수 <script src="https://‹user›.github.io/‹repo›/file.js"></script>있으며 이것이 올바른 MIME 유형입니다.

빌드 파일이 있습니까?

개인적으로이 분기를에 병렬로 실행하는 것이 좋습니다 master. 온 gh-pages지점, 당신은 당신의 편집 할 수 있습니다 .gitignore할 파일을 체크인 하는 동안, 당신이 당신의 위치 (예를 들어, 당신이 어떤 축소 된 경우 / 컴파일 된 파일)에 필요한 모든 DIST / 빌드 파일 무시를 유지하는 당신에 master지점입니다. 일반적으로 일반 리포지토리에서 빌드 파일의 변경 내용을 추적하지 않기 때문에 유용합니다. 당신은 단순히 병합, 호스팅 된 파일을 업데이트 할 때마다 master로 gh-pages, 다시, 커밋 한 다음 누릅니다.

(팁 : 다음 단계를 통해 동일한 커밋에서 병합 및 재 구축 할 수 있습니다.)

$ git checkout gh-pages
$ git merge --no-ff --no-commit master  # prepare the merge but don’t commit it (as if there were a merge conflict)
$ npm run build                         # (or whatever your build process is)
$ git add .                             # stage the newly built files
$ git merge --continue                  # commit the merge
$ git push origin gh-pages

답변

<center id="msg"></center>

<script src="https://raw.githubusercontent.com/sachinjain024/practicebook/master/web-extensions-master/storage/background.js"></script>
<script>
try {
  if (typeof BG.Methods !== 'undefoned') {
    document.getElementById('msg').innerHTML = 'Script evaluated successfully!';
  }
} catch (e) {
  document.getElementById('msg').innerHTML = 'Problem evaluating script';
}
</script>