Spaces:
Running
Running
File size: 5,938 Bytes
0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f 60aea95 0af560f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 |
const path = require("path");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CopyPlugin = require("copy-webpack-plugin");
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const Handlebars = require("handlebars");
const fs = require("fs");
const ImageMinimizerPlugin = require("image-minimizer-webpack-plugin");
const HtmlMinimizerPlugin = require("html-minimizer-webpack-plugin");
const FRAGMENTS_PATH = "src/fragments";
// Load the fragments from the fragments directory and caches it
const loadFragmentsMap = (() => {
let cachedFragments = null;
return async () => {
if (cachedFragments === null) {
cachedFragments = {};
const walkDir = async (dir, basePath = '') => {
const files = fs.readdirSync(dir);
await Promise.all(files.map(async file => {
const filePath = path.join(dir, file);
const relativePath = path.join(basePath, file);
if (fs.statSync(filePath).isDirectory()) {
await walkDir(filePath, relativePath);
} else {
// Remove the .html extension before creating the dotted path
const nameWithoutExt = relativePath.replace(/\.html$/, '');
const dottedPath = 'fragment-' + nameWithoutExt.replace(/\\/g, '-').replace(/\//g, '-').replace(/\./g, '-');
const content = fs.readFileSync(filePath, "utf8");
// Minify the HTML content using swcMinifyFragment
const minifiedRes = await HtmlMinimizerPlugin.swcMinifyFragment({"tmp.html": content})
if (minifiedRes.errors) {
console.error(minifiedRes.errors)
}
const minifiedContent = minifiedRes.code;
cachedFragments[dottedPath] = minifiedContent;
}
}));
};
await walkDir(FRAGMENTS_PATH);
}
return cachedFragments;
};
})();
const transformHandlebars = async (data, path) => {
const fragments = await loadFragmentsMap();
console.log(`Available fragments: ${Object.keys(fragments).join(', ')}`);
// Load the template file
const template = Handlebars.compile(data.toString('utf8'));
const html = template(fragments);
return html;
};
module.exports = {
entry: {
distill: "./src/distill.js",
main: "./src/index.js",
},
output: {
filename: "[name].bundle.js", // The output file
path: path.resolve(__dirname, "dist"), // Output directory
},
module: {
rules: [
{ test: /\.css$/, use: ["style-loader", "css-loader"] },
{
test: /\.(js|mjs)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
},
},
},
{}
],
},
plugins: [
new CleanWebpackPlugin(),
new CopyPlugin({
patterns: [
{
from: "assets",
to: "assets",
},
{ from: "src/fragments/*", to: "fragments/[name].html" },
{ from: "src/style.css", to: "style.css" },
{ from: "src/bibliography.bib", to: "bibliography.bib" },
{
from: "src/index.html",
to: "index.html",
transform: transformHandlebars,
},
],
}),
],
devtool: process.env.NODE_ENV === 'production' ? 'source-map' : 'eval-source-map',
devServer: {
static: "./dist", // Serve files from the 'dist' directory
open: process.env.NODE_ENV !== 'production', // Automatically open the browser unless in production
hot: process.env.NODE_ENV !== 'production', // Enable hot module replacement unless in production
},
mode: process.env.NODE_ENV === 'production' ? 'production' : 'development',
optimization: {
minimizer: [
// Hynek: Ideally we would convert all images to webp and just use webp, but I don't have time
// to write script which would also modify html to reflect the new extensions.
new ImageMinimizerPlugin({
minimizer: [{
implementation: ImageMinimizerPlugin.sharpMinify,
options: {
encodeOptions: {
// For JPG
jpeg: {
quality: 80
},
// For PNG
png: {
quality: 80
},
// For WebP
webp: {
quality: 80
}
}
}
},
{
implementation: ImageMinimizerPlugin.svgoMinify,
options: {
encodeOptions: {
multipass: true,
plugins: [
'preset-default',
]
}
}
}
]
}),
//Hynek: Ideally we don't run this twice but we
new HtmlMinimizerPlugin({
test: /fragments\/.*\.html$/i,
minify: HtmlMinimizerPlugin.swcMinifyFragment,
})
]
},
};
console.log(process.env.NODE_ENV) |