prod環境publicPathが相対パスの場合、cssで参照されているurlパスエラー
985 ワード
さいせい //
vue init webpack
config/indexを変更します.jsプロファイルbuild.assetsPublicPathは'./'
でApp.vueの
にbackground:url('./asssets/images/xxx.png')などの パス のスタイルを します.
パッケージコマンドを npm run build
されたcss
のurl()
の の はstatic/img/xxx.png
であることがわかります.ブラウザでindexを きます.htmlにはxxxxxxx/static/css/static/img/xxx.png
という 404
のエラーが されます.
に、css
に してpublicPath
を に し、build/utils.js
ファイルのExtractTextPlugin
プラグインのoptions
の を する があります. if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
publicPath: '../../', // ,
fallback: 'vue-style-loader'
})
} else {
return ['vue-style-loader'].concat(loaders)
}
//
vue init webpack
npm run build
に、
css
に してpublicPath
を に し、build/utils.js
ファイルのExtractTextPlugin
プラグインのoptions
の を する があります. if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
publicPath: '../../', // ,
fallback: 'vue-style-loader'
})
} else {
return ['vue-style-loader'].concat(loaders)
}