const merge = require('webpack-merge');
const webpack = require('webpack');
const path = require('path');
const cacheDir = path.resolve(__dirname, 'node_modules', '.cache');
const getThreadLoader = name => ({
loader: 'thread-loader',
options: {
workerParallelJobs: 50,
poolRespawn: false,
name
}
});
const baseWebpackConfig = require('./webpack.base.config');
const devWebpackConfig = merge(baseWebpackConfig, {
// DEV config
mode: "development",
output: {
filename: js/[name].js
, // имя файла
},
devtool: "cheap-module-eval-source-map", // подключаем сорс мапы для отладки
devServer: {
// настройки дев серва
host: "localhost", // default
contentBase: baseWebpackConfig.externals.PATH_BUILD,
port: "8081", // 8080 по дефолту (у докера такой же), поэтому заменил порт
overlay: {
warnings: true,
errors: true
},
proxy: {
'/**': {
target: 'http://localhost:8081/region.html',
pathRewrite: {
'.*': ''
}
}
},
progress: true,
inline: true,
quiet: true,
compress: true,
historyApiFallback: true,
hot: true,
open: true
},
// Пересборка при изменениях и уменьшение задержки перед ней
watch: true,
watchOptions: {
aggregateTimeout: 100
},
module: {
rules: [{
// правила для модулей
test: /\.js$/, // какие файлы обрабатывать
exclude: "/node_modules/", // исключаем файлы, тк библиотеки прогоняются через бабель
use: [{
loader: 'cache-loader',
options: {
cacheDirectory: path.resolve(cacheDir, 'js')
}
},
getThreadLoader('js'), {
loader: 'babel-loader',
options: {
cacheDirectory: path.resolve(cacheDir, 'babel')
}
}
]
},
{
test: /\.scss$/,
use: [
{
loader: 'cache-loader',
options: {
cacheDirectory: path.resolve(cacheDir, 'css')
}
},
getThreadLoader('css'),
'style-loader',
{
loader: 'css-loader',
options: {
sourceMap: true,
importLoaders: 3,
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true,
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true,
}
},
'import-glob-loader'
]
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.SourceMapDevToolPlugin({
filename: "[file].map",
}),
]
});
module.exports = new Promise((resolve, reject) => {
resolve(devWebpackConfig)
})