122 lines
3.8 KiB
JavaScript
122 lines
3.8 KiB
JavaScript
const path = require("path");
|
||
|
||
const resolve = (dir) => {
|
||
return path.join(__dirname, dir);
|
||
};
|
||
|
||
// 项目部署基础
|
||
const BASE_URL = process.env.NODE_ENV === "development" ? "/" : "/";
|
||
const sourceMap = process.env.NODE_ENV === "development";
|
||
const ResponsiveLoaderSharp = require('responsive-loader/sharp');
|
||
|
||
module.exports = {
|
||
publicPath: BASE_URL,
|
||
lintOnSave: false, // 是否启用 eslint
|
||
|
||
chainWebpack: (config) => {
|
||
// 禁用 CaseSensitivePathsPlugin
|
||
config.plugins.delete('case-sensitive-paths');
|
||
|
||
// 别名
|
||
config.resolve.alias.set("@", resolve("src"));
|
||
config.resolve.alias.set("_c", resolve("src/components"));
|
||
|
||
// SVG 文件处理
|
||
config.module.rule('svg')
|
||
.test(/\.svg$/)
|
||
.use('file-loader')
|
||
.loader('file-loader')
|
||
.options({
|
||
name: 'assets/svg/[name].[hash:8].[ext]'
|
||
});
|
||
|
||
// 普通图片处理（排除 SVG）
|
||
config.module.rule('images')
|
||
.test(/\.(png|jpe?g|gif)(\?.*)?$/)
|
||
.use('url-loader')
|
||
.loader('url-loader')
|
||
.options({
|
||
limit: 10000,
|
||
esModule: false,
|
||
outputPath: "images/"
|
||
});
|
||
|
||
// 图片压缩
|
||
config.module.rule('images')
|
||
.use('image-webpack-loader')
|
||
.loader('image-webpack-loader')
|
||
.options({
|
||
bypassOnDebug: true,
|
||
mozjpeg: { progressive: true, quality: 60 },
|
||
optipng: { enabled: false },
|
||
pngquant: { quality: [0.5, 0.6], speed: 4 },
|
||
gifsicle: { interlaced: false },
|
||
webp: { quality: 75 }
|
||
});
|
||
|
||
|
||
|
||
|
||
// config.module.rule('responsive-images')
|
||
// .test(/\.(png|jpe?g|gif)$/i)
|
||
// .use('responsive-loader')
|
||
// .loader('responsive-loader')
|
||
// .options({
|
||
// adapter: ResponsiveLoaderSharp,
|
||
// sizes: [1200, 1920], // 超过宽度会生成缩小版本
|
||
// quality: 75,
|
||
// name: 'images/[name]-[width].[ext]',
|
||
// placeholder: false
|
||
// });
|
||
|
||
},
|
||
|
||
configureWebpack: {
|
||
output: {
|
||
filename: "js/[hash].js",
|
||
}
|
||
},
|
||
|
||
css: {
|
||
loaderOptions: {
|
||
postcss: {
|
||
postcssOptions: {
|
||
plugins: [
|
||
require('autoprefixer'),
|
||
require('postcss-pxtorem')({
|
||
rootValue: 16,
|
||
propList: ['*'],
|
||
selectorBlackList: [],
|
||
replace: true,
|
||
mediaQuery: false,
|
||
minPixelValue: 1,
|
||
exclude: /node_modules/i
|
||
})
|
||
]
|
||
}
|
||
},
|
||
less: {
|
||
lessOptions: {
|
||
javascriptEnabled: true,
|
||
modifyVars: {
|
||
'@primary-color': '#3498db',
|
||
'@success-color': '#52c41a',
|
||
'@warning-color': '#faad14',
|
||
'@error-color': '#f5222d',
|
||
'@font-size-base': '14px',
|
||
'@heading-color': '#262626',
|
||
'@text-color': '#595959',
|
||
'@text-color-secondary': '#8c8c8c',
|
||
'@disabled-color': '#bfbfbf',
|
||
'@border-radius-base': '4px',
|
||
'@border-color-base': '#d9d9d9',
|
||
'@box-shadow-base': '0 2px 8px rgba(0, 0, 0, 0.15)'
|
||
}
|
||
}
|
||
}
|
||
}
|
||
},
|
||
|
||
productionSourceMap: sourceMap,
|
||
};
|