You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.3 KiB
48 lines
1.3 KiB
3 years ago
|
/** @type {import('@vue/cli-service').ServicePlugin} */
|
||
|
|
module.exports = (api, options) => {
|
||
|
|
const getAssetPath = require('../util/getAssetPath')
|
||
|
|
|
||
|
|
const genAssetSubPath = dir => {
|
||
|
|
return getAssetPath(
|
||
|
|
options,
|
||
|
|
`${dir}/[name]${options.filenameHashing ? '.[hash:8]' : ''}[ext]`
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
api.chainWebpack(webpackConfig => {
|
||
|
|
webpackConfig.module
|
||
|
|
.rule('svg')
|
||
|
|
.test(/\.(svg)(\?.*)?$/)
|
||
|
|
// do not base64-inline SVGs.
|
||
|
|
// https://github.com/facebookincubator/create-react-app/pull/1180
|
||
|
|
.set('type', 'asset/resource')
|
||
|
|
.set('generator', {
|
||
|
|
filename: genAssetSubPath('img')
|
||
|
|
})
|
||
|
|
|
||
|
|
webpackConfig.module
|
||
|
|
.rule('images')
|
||
|
|
.test(/\.(png|jpe?g|gif|webp|avif)(\?.*)?$/)
|
||
|
|
.set('type', 'asset')
|
||
|
|
.set('generator', {
|
||
|
|
filename: genAssetSubPath('img')
|
||
|
|
})
|
||
|
|
|
||
|
|
webpackConfig.module
|
||
|
|
.rule('media')
|
||
|
|
.test(/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/)
|
||
|
|
.set('type', 'asset')
|
||
|
|
.set('generator', {
|
||
|
|
filename: genAssetSubPath('media')
|
||
|
|
})
|
||
|
|
|
||
|
|
webpackConfig.module
|
||
|
|
.rule('fonts')
|
||
|
|
.test(/\.(woff2?|eot|ttf|otf)(\?.*)?$/i)
|
||
|
|
.set('type', 'asset')
|
||
|
|
.set('generator', {
|
||
|
|
filename: genAssetSubPath('fonts')
|
||
|
|
})
|
||
|
|
})
|
||
|
|
}
|