Personal_Website/webpack.config.js
2022-05-26 11:44:06 +02:00

66 lines
2.0 KiB
JavaScript

const fs = require('fs');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const { ModuleFilenameHelpers } = require('webpack');
function getPugHtmlPluginEntries(basepath) {
const pugTemplateFiles = fs.readdirSync(basepath)
.filter(file => path.extname(file).toLowerCase() === '.pug');
return pugTemplateFiles.map(pugFileName => new HtmlWebpackPlugin({
inject: true,
hash: false,
filename: `${path.parse(pugFileName).name}.html`,
template: path.join(basepath, pugFileName),
}));
}
module.exports = (env, argv) => {
const isDevelopment = argv.mode === 'development';
return {
entry: {
app: './src/js/app.js',
},
output: {
path: path.resolve(__dirname, 'build'),
filename: "[name].bundle.js",
},
devServer: {
port: 3000,
},
plugins: [
...getPugHtmlPluginEntries('./src'),
new MiniCssExtractPlugin({
filename: isDevelopment ? '[name].css' : '[name].[hash].css',
chunkFilename: isDevelopment ? '[id].css' : '[id].[hash].css',
}),
],
module: {
rules: [
{
test: /\.pug$/,
use: ["pug-loader"],
},
{
test: /\.scss$/,
use: [
isDevelopment ? "style-loader" : MiniCssExtractPlugin.loader,
"css-loader",
{
loader: "sass-loader",
options: {
sourceMap: isDevelopment,
},
},
],
},
],
},
resolve: {
extensions: ['.js', '.scss'],
},
};
}