Vuejs 웹팩 접두사 고정 자산

Question

는

안녕하세요 저는 vue-cli과 vue init vuetifyjs/webpack-advanced를 결과 코드는 내가 가진 문제는 내 생산 앱이 서버의 루트에 있지하고 있다는 것이다이 https://github.com/vuetifyjs/webpack-advanced/tree/master/template

되어 사용 Vuetify 응용 프로그램을 만들었습니다 하위 경로는 www.example.com/foo입니다. 나는 이미지와 글꼴 등의 npm run build 내 모든 고정 자산을 실행하면 /static/images/example.png처럼 참조되는, 그래서 서버는 내가 config/index.js을 변경하면 그들이 www.example.com/foo/static/images/example.png

대신 www.example.com/static/images/example.png에보고되고 그들을 찾아 assetsPublicPath: '/foo'를 설정하고 변경되지 않습니다 내 모든 /static/...에서 /foo/static/...에 이르기까지 내 프로덕션 서버는 모든 정적 자산을 찾았지만 npm run dev을 사용하는 내 dev 서버는 localhost:8080/foo/static/images/example.png으로 참조되고 있지만 어떤 이유로 든 localhost:8080/static/images/example.png 인 것처럼 보입니다.

이상적인 해결책은 참조를/정적으로 유지하고 webpack 또는 vueloader에게 어쨌든 npm run build에 모든 자산에/foo를 추가해야한다고 말합니다. 즉 적어도 불가능하면 나는 내 고정 자산 URL을

에/수동 foo에 씁니다 의미에도 불구하고 내 dev에 생산 enviroments에이 같은 코드로 작업 할 수있는 방법을 알고 싶은 당신에게

Answer 1

감사 것 템플릿에는이 기능이 내장되어 있으며 config/dev.env.js 및 config/prod.env.js에 다른 값을 설정하면 환경에 따라 기본 템플릿보다 우선 적용됩니다.

Answer 2

당신은 생산 및 디바이스 환경을 구별하는 process.env.NODE_ENV를 사용할 수 있습니다

.... 
assetsPublicPath: process.env.NODE_ENV === 'production' ? '/foo' : '', 
....