vuejs 프로젝트를 heroku에 전개하는 방법
저는 https://github.com/misterGF/CoPilot에서 이 프로젝트를 진행하고 있습니다만, 이 프로젝트가 종료되었으므로 헤로쿠에 푸시하고 싶습니다.문제는 heroku에게 앱을 시작하라고 말하는 것입니다.
heroku의 예에서는 데모서버는 다음에서 정보를 취득한 후 실행됩니다.Procfile
이 데이터가 포함되어 있습니다.
web: node index.js
그러나 vuejs 프로젝트에는 콘텐츠를 서버하는 index.js가 없습니다.
나는 주요 진입점만 가지고 있다.index.html
procfile은 HTML에서는 동작하지 않습니다.
또한 소규모 스태틱서버를 정의하여index.html
파일입니다. 간단한 설정 예는,http-server
:
npm install -S http-server
그리고 당신의Procfile
다음과 같이 됩니다.
web: http-server ./ -p $PORT
패키지를 업데이트해야 합니다.예를 들어 express를 사용하여 파일을 처리하는 경우 다음과 같이 heroku에게 패키지에 대해 알려줍니다.
"scripts": {
"postinstall": "npm install express"
}
// "start": "node server.js" (executing server.js) during start
server.displaces
var express = require('express')
var path = require('path')
var serveStatic = require('serve-static')
var app = express()
app.use(serveStatic(path.join(__dirname, 'dist')))
var port = process.env.PORT || 8000
app.listen(port)
console.log('server started ' + port)
건설하는 것을 잊지 마세요.
빌드 컨피드에 대한 자세한 내용은 여기를 참조하십시오.빌드 프로세스 커스터마이즈 - Heroku
옵션의 경우는, 다음과 같이 http-server 를 글로벌하게 인스톨 할 수도 있습니다.
npm install -g http-server
및 Proc 파일을 업데이트하여 위의 답변과 같이 구성을 추가합니다.
알아두기 위해서:
- npm 인스톨에서는, 「의존」과 「의존」이 모두 인스톨 됩니다.
- npm install -- 프로덕션에서는 "의존관계"만 설치됩니다.
- npm install --dev는 "devDependencies"만 설치합니다.
사용.http-server
. 단, 패키지는 글로벌하게 설치되어 있지 않기 때문에 다음과 같이 패키지에 대한 풀패스를 사용해야 합니다.
web: ./node_modules/http-server/bin/http-server ./ -p $PORT
언급URL : https://stackoverflow.com/questions/46119350/how-to-deploy-a-vuejs-project-to-heroku
'programing' 카테고리의 다른 글
다시 Vue.nextTick을 Vuex 변환에 사용하는 것이 관례입니까?뭔가 부서질까? (0) | 2022.08.27 |
---|---|
대규모 SPA에서 우수한 VueX 스토어 디자인을 사용하는 방법 (0) | 2022.08.27 |
vue i18n - javascript 오브젝트로 사용(템플릿 내가 아님) (0) | 2022.08.27 |
Java 런타임 퍼포먼스와 네이티브 C/C++ 코드 비교 (0) | 2022.08.27 |
Java에서 플로트를 int로 변환하는 방법 (0) | 2022.08.27 |