>  기사  >  웹 프론트엔드  >  원사를 사용하여 vue의 cli 공식 파일에서 수동 순수 정적 파일 패키징 및 배포 미리 보기 링크(GitHub에 배포)

원사를 사용하여 vue의 cli 공식 파일에서 수동 순수 정적 파일 패키징 및 배포 미리 보기 링크(GitHub에 배포)

大佬别动我昵称
大佬别动我昵称원래의
2021-11-12 23:08:16177검색

프로젝트를 작성한 후 배포하고 게시해야 합니다. vue@cli를 사용하여 빌드된 이 프로젝트에는 프런트엔드 정적 파일만 있고 백엔드 인터페이스를 호출하며 GitHub에 배포된 경우 이 단계를 사용할 수 있습니다.

참고 사항: 1. gitbash가 설치 및 구성되었습니다.

2. 코드를 수정할 때마다 이를 프로덕션 환경으로 푸시해야 합니다.

3. 이는 수동 업데이트 단계이지만 다음과 같이 할 수도 있습니다. 자동으로 업데이트됩니다. 추가 구성이 필요합니다

두 가지 환경이 있으므로 두 개의 웨어하우스를 구축해야 합니다. 하나는 코드가 배치되는 환경이고 다른 하나는 코드 환경에서 코드 변경이 필요합니다. 그러면 새로운 생산 라인 브레이크가 생성되고 생산 환경이 저장된 창고로 푸시됩니다.

1, 명령줄

```yarn build

```

2.

링크를 클릭하세요. 그리고 언어를 중국어

로 전환하세요![빌드 성공 후 링크]( https://img.php.cn/upload/image/421/242/536/1636642339926184.png "빌드 성공 후 링크")

생성된 dist 디렉터리를 모니터링하려면 무언가를 사용하세요

~~~

Yarn global add Serve

Serve -s dist

//이 두 줄은 dist 디렉터리가 패키지되었는지 확인하기 위한 것입니다

~~~

설치 후 , 웹 페이지 포트가 5000 이상이 되고 패키지 파일이 압축됩니다.

3.vue.config.js에서 올바른 publicPath를 설정하세요.

~~~

module.exports = {

publicPath: process.env.NODE_ENV === 'production'

? '/my-project/' //프로덕션 환경 이름

: '/ ' / /

}

~~~

4. 프로젝트에 배포.sh 파일을 생성합니다

~~~

#!/usr/bin/env sh

# 오류 발생 시 스크립트 중단

set - e

# Build

npm run build

# 빌드 출력 디렉터리로 cd

cd dist

# 사용자 정의 도메인 이름에 배포

# echo 'www.example.com' > ; CNAME

git init

git add -A

git commit -m 'deploy'

# https://.github.io

#에 배포 git push -f git@github.com : /.github.io.git master

# https://.github.io/

# git push -f git@github에 배포합니다. com: ;/.git master:gh-pages

cd -

~~~

그런 다음 배포.sh

~~~

//gitbash 환경을 구성해야 합니다. , cmder

sh 배포 sh

//파일에서 명령을 실행합니다

~~~

위 내용은 원사를 사용하여 vue의 cli 공식 파일에서 수동 순수 정적 파일 패키징 및 배포 미리 보기 링크(GitHub에 배포)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.