vue todo app

TODO-APP

Vue, Vuex 및 Element.ui 간의 통합을 실천하는 것은 쉬운 프로젝트입니다.

데모 : https://oussamaalouat.github.io/vue-todo-app/

프로젝트 설정

 npm install

개발을 위해 컴파일 및 핫 릴로드

 npm run serve

생산을 위해 컴파일하고 최소화합니다

 npm run build

Heroku 서버에 배포됩니다

1. 루트 앱 디렉토리에서 Server.js 파일을 만듭니다.
2. "Express"및 "Serv-Static"의존성이 설치되어 있는지 확인하십시오.
3. 기계에 Heroku를 설치하십시오 (지침)-> https://devcenter.heroku.com/articles/heroku-cli
4. Heroku 단계 (터미널의 다음 단계를 수행).
   • 헤로쿠 로그인
   • Heroku는 Vue-Todo-App을 만듭니다
   • git init (프로젝트가 git repo가없는 경우에만)
   • Heroku Git : 원격 -A Vue-Todo-App
   • git 추가.
   • git commit -am "Heroku 배포"
   • git 푸시 헤로쿠 마스터
5. 앱이 준비되어 있습니다. Heroku의 문서에서 모든 Heroku 단계를 볼 수 있습니다.

Heroku의 내 앱 : https://vue-todo-test.herokuapp.com/

webapp.io에 배포하십시오

1. 이 저장소 (LayerFile과 함께)를 포크하십시오.
2. webapp.io에서 무료 계정을 만듭니다.
3. github에 webapp.io를 설치하십시오.
   • WebApp.io 가이 포크 리포지토리에 액세스 할 수 있는지 확인하십시오.
4. 포크 리포지토리로 밀어 넣으십시오.
   • 필요한 경우 강제 마스터 브랜치로 밀어 넣으십시오.
5. "최근 Commits"페이지에서 LayerFile이 실행을 끝내기를 기다립니다.
6. LayerFile이 성공적으로 완료된 후 "배포"버튼을 클릭하고 배포 할 도메인을 선택하십시오.

자세한 내용은 호스팅시 WebApp.io 문서를 확인하십시오.

Github 페이지

모든 VUE 프로젝트에 GitHub 페이지를 갖기 위해 :

1. deploy.sh 파일 ->이 파일을 루트 앱의 폴더에 추가하십시오.

 #! /usr/bin/env sh

# abort on errors
set -e

# build
npm run build

# navigate into the build output directory
cd dist

# if you are deploying to a custom domain
# echo 'www.example.com' > CNAME

git init
git add -A
git commit -m ' deploy '

# if you are deploying to https://<USERNAME>.github.io
# git push -f [email protected]:<USERNAME>/<USERNAME>.github.io.git master

# if you are deploying to https://<USERNAME>.github.io/<REPO>
git push -f [email protected]:OussamaAlouat/vue-todo-app.git master:gh-pages

cd -

2. vue.config.js->이 파일을 루트의 앱에 추가하십시오. (내 github 프로젝트 이름이기 때문에 '/vue-todo-App'을 결정합니다. 당신은 당신의 github 프로젝트 이름을 넣습니다)

 module . exports = {
    baseUrl : process . env . NODE_ENV === 'production'
        ? '/vue-todo-app/'
        : '/'
}