when I use CSS-loader I set the options of url value false,then my url-loader won't handle the img where used in backgroud-url. The following is my setting,where is my problem?
css-loader config
exports.cssLoaders = function(options) {
options = options || {};
const cssLoader = {
loader: 'css-loader',
options: {
sourceMap: options.sourceMap,
**url:false**,
}
};
const postcssLoader = {
loader: 'postcss-loader',
options: {
sourceMap: options.sourceMap
}
};
// generate loader string to be used with extract text plugin
function generateLoaders(loader, loaderOptions) {
const loaders = options.usePostCSS
? [cssLoader, postcssLoader]
: [cssLoader];
if (loader) {
loaders.push({
loader: loader + '-loader',
options: Object.assign({}, loaderOptions, {
sourceMap: options.sourceMap
})
});
}
// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath: '../../'
});
} else {
return ['vue-style-loader'].concat(loaders);
}
}
url-loader config
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
exclude: [resolve('src/assets/icon')],
options: {
limit: 10000,
publicPath: publicAssetsPath,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
publicPath: publicAssetsPath,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
publicPath: '../../',
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
I cann't all use "publicPath: '../../", because The element img tag used "url" the path will become wrong. So is there any way to solve this problem? Thank you !