Прямо сейчас у меня есть настройки vue .config. js, чтобы файлы JS были разбиты на несколько более мелких кусков. То же самое происходит для CSS. Однако я не хочу, чтобы CSS был разбит, а скорее был объединен в один CSS файл. Я не могу заставить конфигурацию работать.
Все блоки CSS находятся в каталоге dist / resources / static / css
const config = {
assetsDir: 'resources/static',
productionSourceMap: false,
devServer: {
disableHostCheck: true,
https: isDevelop && !httpsConfig ? httpsConfig : false,
proxy: {
'/api': {
target: 'http://localhost:8080',
secure: false,
},
},
port: process.env.APP_PORT,
},
configureWebpack: {
devtool: isDevelop ? 'eval-source-map' : '',
entry: ['@babel/polyfill', './src/main.js'],
optimization: {
splitChunks: {
minSize: 10000,
maxSize: 200000,
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
chunks: 'all',
},
// Merge all the CSS into one file
styles: {
name: 'styles',
test: /\.s?css$/,
chunks: 'all',
minChunks: 1,
reuseExistingChunk: true,
enforce: true,
},
},
},
minimizer: [
new TerserPlugin({
sourceMap: isDevelop,
cache: './cache/terser',
parallel: true,
terserOptions: {
compress: {
collapse_vars : false,
},
},
}),
],
},
plugins: [
new HTMLWebpackPlugin({
inject: true,
chunksSortMode: 'dependency',
filename: 'index.html',
template: './public/index.html',
SOCKET_RECONNECTION_LIMIT: process.env.SOCKET_RECONNECTION_LIMIT,
SOCKET_CONNECTION_THRESHOLD: process.env.SOCKET_CONNECTION_THRESHOLD,
}),
],
output: {
filename: '[name].[hash].js',
},
},
css: {
extract: {
filename: path.join('resources', 'static', 'css', '[name].[hash].css'),
},
},
}