하위 디렉토리에 VueJS App 배포

하위 디렉토리에 VueJS App 배포

Webpack CLi를 사용하여 구축된 Vue JS 앱을 배포하는 데 문제가 있습니다.

루트 디렉토리에 업로드하면 모든 것이 정상적으로 처리되지만 하위 폴더 내에서는 모든 링크가 끊어집니다.

기본 href를 추가했습니다.

    <base href="/dist/">

스크립트가 로드되지만 Webpack에 의해 작성된 모든 자산 경로가 파손되어 이미지 및 글꼴이 루트 디렉토리를 가리키고 있을 때 로드되지 않습니다.

누가 좀 도와줄래요?

Vue CLI 3의 경우 매우 간단합니다.

의 편집vue.config.js(없을 경우 프로젝트 루트 디렉토리에 작성합니다)다음 행을 추가합니다.

module.exports = {
  baseUrl: "./"
};

원하는 서브디렉토리라도 상관없습니다.

다음에 따라 결정할 수도 있습니다.NODE_ENV문서를 참조해 주세요.

module.exports = {
  baseUrl: process.env.NODE_ENV === 'production'
    ? '/production-sub-path/'
    : '/'
}

갱신하다

아래 코멘트에서 설명한 바와 같이 Vue CLI 3.3 이상 사용publicPath대신 재산baseUrl.

vue-cli에서 웹 팩 템플릿을 사용하는 경우assetsPublicPathproperty in config/index.delays - 다음 명령어에 대한build및 을 위해dev

자세한 내용은 문서의 "Static Assets" 섹션을 참조하십시오.

업데이트:

CLI v3+ 사용자용 새로운 링크: https://cli.vuejs.org/guide/html-and-static-assets.html

숙박업소가 방금 호출된 것에 주의하세요.

응용 프로그램을 설치했을 경우

npm install -g @vue/cli vue ui 그런 다음 상단 프로젝트 폴더(여기서 패키지)에 vue.config.dll 파일을 생성해야 합니다.json is)를 사용하여 위와 같이 붙여넣습니다.

언급URL : https://stackoverflow.com/questions/43879418/deploy-vuejs-app-in-a-subdirectory